How to make a placeholder image

Pick a common size, or type your own width and height.
Choose the colours and, if you like, your own label. Without one, the image shows its size.
Choose a format. The preview updates as you go.
Press Download, or copy the image as a data URI or a ready-made <img> tag.

Download every common size makes one image for each size in the list, with your colours and options, and saves them together in a ZIP file. Each shows its own size unless you have typed a label.

Formats

PNG is lossless and keeps transparent colours. A good default.
JPEG files are small and work everywhere, but JPEG has no transparency, so any transparent background is placed on white.
WebP is smaller still. The option appears when your browser can create WebP images.
SVG is a few hundred bytes at any size and stays sharp when scaled, which makes it the best choice for data URIs and prototypes.

Rules this tool follows

Sizes go up to 8,000 pixels on each side.
PNG, JPEG and WebP images are drawn by your browser, which can handle up to about 16.7 megapixels (4,096 × 4,096) on every device. Larger images are available as SVG.
With the font size left empty, the label is sized to fit: no taller than a fifth of the image, and no wider than about 80% of it.
Diagonal lines and the border use the text colour at half strength, so they never overpower the label.
The <img> tag always includes the width and height, so pages don’t jump as images load. For SVG the image is inside the tag as a data URI; for other formats it points at the downloaded file’s name.

Limitations

Labels are a single line of up to 200 characters. Very long labels on small images become tiny.
The label uses your device’s standard font, so it looks slightly different on Windows, Mac and phones.
Images are generated in your browser and nothing is uploaded, so there is no link to share; download the file instead.

Frequently asked questions

Should I use SVG or PNG?

SVG files are tiny and stay sharp at any size, so they are ideal as placeholders in web pages and prototypes, and as data URIs. Use PNG, JPEG or WebP when a tool or upload form only accepts ordinary images, or when you need a file of realistic weight to test page loading.

Why does the label look slightly different in the SVG?

The SVG asks for your system’s standard font when it is displayed, so the label appears in whatever font the viewer’s device provides. PNG, JPEG and WebP images have the text drawn into the pixels with your device’s font, so they look the same everywhere.

What is a data URI?

A data URI puts the whole image inside a piece of text that starts with data:, so you can paste it straight into an <img src> attribute or a CSS url() without a separate file. It suits small images; large ones make your HTML or CSS heavy, so the tool warns you when a data URI gets big.