Placeholder image generator
Set the width and height, choose the colours and type a caption, or leave it empty to show the size. The preview updates as you type; download the placeholder as PNG, JPG or a tiny SVG for mock-ups and layouts. Nothing is uploaded.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Enter the width and height, or press a common size.
- Choose the background and text colours.
- Type a caption, or leave the field empty to show the size.
- Choose PNG, JPG or SVG and press Download placeholder.
How it works
The preview is drawn on a canvas, and the file is drawn again at the exact size when you download it. The caption is centred. SVG output is written as text: a rectangle and a centred text element, so it has no pixels of its own.
Example
A 600 × 400 placeholder with no caption shows the text “600 × 400”, nine characters, in a font of 100 px: a quarter of the height and also the largest that fits the width.
Tips
- Choose colours with enough contrast between background and text so the caption stays readable.
- Name files by size, as the download does: placeholder-600x400.png.
Frequently asked questions
What is the largest size?
4096 pixels on each side. Larger values are reduced to 4096, because browsers limit how big a picture can be drawn safely, especially on phones. For anything bigger use the SVG, which scales to any size.
PNG, JPG or SVG: which one?
SVG is a few hundred bytes and stays sharp at any size, which is ideal for web layouts. PNG is exact and lossless, JPG is lossy and smaller for large sizes. The caption is part of the picture in all three.
How is the text size chosen?
It is at most a quarter of the height and is reduced until the caption fits within 90% of the width, so long captions get smaller rather than cut off. The font is the system sans-serif font of the device that creates the file.
Can I use these images in my project?
Yes. They are plain coloured rectangles with text made on your device, and you can use them in mock-ups, tests, documentation or designs.