images

Collection of free images and resources for Websites and Apps served from GitHub's CDN.

The heroes.js module returns different URLs to 2560x1000 /hero images ideal for usage in hero backgrounds.

Live Example: /heroes

usage

From web page:

<script src="https://servicestack.github.io/images/heroes.js" />

<script>document.write(`<img src="${heroes.random()}">`)</script>

From a npm-based Web App:

$ npm install @servicestack/images

Import using ES6 modules or TypeScript:

import { heroes } from "@servicestack/images";

React Example

const Hero = <img src={heroes.random()} />;

Vue Example

<template>
  <img :src="heroes.daily()">
</template>

<script>
import { heroes } from "@servicestack/images";

export default {
  methods: {
    heroes
  }
}
</script>

dependency-free

As heroes.js doesn't have any dependencies it can also be copied and used locally:

$ curl https://servicestack.github.io/images/heroes.js -o heroes.js

Where it can be referenced as a relative module:

import heroes from "./heroes";

console.log(heroes.random());