Placeholder image generator

Custom placeholder images for your web app or wireframe.

Base URL is https://jsonexamples.com/image. Provide the size after the URL — only the size is required. Append a background colour, then a text colour (both hex), then any number of query options. The text query option overrides the default label.

<img src="https://jsonexamples.com/image/300">
<img src="https://jsonexamples.com/image/250x100">
<img src="https://jsonexamples.com/image/250x100/ff0000">
<img src="https://jsonexamples.com/image/350x200/ff0000/000">
<img src="https://jsonexamples.com/image/350x200/?text=Hello+Peter">
<img src="https://jsonexamples.com/image/350x200/282828/eae0d0/?text=Hello+Peter&fontFamily=cookie">

Quick samples

Specify one dimension for a square image

URL/WIDTH

https://jsonexamples.com/image/150

Specify width and height

URL/WIDTHxHEIGHT

https://jsonexamples.com/image/400x200

Specify background colour

URL/SIZE/BACKGROUND

https://jsonexamples.com/image/400x200/282828

Specify text colour

URL/SIZE/BACKGROUND/COLOR

https://jsonexamples.com/image/400x200/282828/ff0000

Specify image format (png/jpg/webp)

URL/?type=TYPE

https://jsonexamples.com/image/400x200/282828?type=jpg

Specify custom text

URL/?text=TEXT

https://jsonexamples.com/image/400x200/282828?text=Hello+Peter!

Specify font family

URL/?text=TEXT&fontFamily=cookie

https://jsonexamples.com/image/400x200/282828?text=Hello+Peter!&fontFamily=cookie

Specify font size

URL/?text=TEXT&fontSize=FONT_SIZE

https://jsonexamples.com/image/400x200?text=Hello+Peter!&fontSize=16

Available fonts

Click any font to preview the rendered image.