Image Placeholder Source

a helper for using structured data to populate various image placeholder sources.

npm install img-placeholder-src
Docs

Star

This page is meant to serve as an overview of what the module can do. For details, reference the API docs

Playground

Choose your options and hit update to load the new placeholder image. Keep in mind, not all options are supported by each placeholder image service.

Image Sources

Here are examples of all the provided image placeholder services as well as an example of a custom image service. Each of these examples uses the same image data but the url is generated from a different IPS image service.

See Usage docs for details

Default Source

Default Srcset

Lorempixel Source

Lorempixel Srcset

Fillmurray Source

Fillmurray Srcset

Placecage Source

Placecage Srcset

Placeimg Source

Placeimg Srcset

Satyr Source

Satyr Srcset

Custom Source (placekitten)

Custom Srcset (placekitten)

Image Variations

Passing the unique option increments the photo image size by one. This forces the image services to provide a different image, rather that sending the same image for matching dimension requests.

See API docs for details

Non-Unique

Unique

Service Override

Setting a serviceOverride option when initializing a IPS instance will force all placeholder images to use that service.

See API docs for details

placecage
lorempixel
placeimg
fillmurray