Placeholder Image Generator
Generate placeholder images of any size in SVG, PNG or JPG — pick colors and a label, preview instantly, then download the file or copy the SVG markup.
Everything is generated locally: the SVG is pure markup you can paste into any project, and PNG/JPG versions are rendered on a canvas in your browser.
This tool runs entirely in your browser. Your data never leaves your device — it is not uploaded to any server.
How to use
- 1Enter the width and height in pixels.
- 2Set the background and text colors, and an optional label (defaults to the dimensions).
- 3Download as SVG, PNG or JPG — or copy the SVG markup and paste it anywhere.
Placeholder Image Generator
Mockups and wireframes need image boxes before the real assets exist. Type a width and height — a hero at 1200×630, an avatar at 256×256, or anything from 1×1 up to 5000×5000 — choose background and text colors, optionally add a label, and the placeholder renders live as you type.
Download the result as SVG, PNG or JPG, or copy the SVG markup straight to your clipboard: it is a handful of readable elements, not base64 soup, so you can paste it into HTML, JSX or Figma and edit the text and colors by hand. Everything is generated in your browser; nothing is uploaded.
Frequently asked questions
When should I use SVG instead of PNG or JPG?
SVG is text: tiny, infinitely scalable and editable by hand, which makes it ideal for mockups, docs and e-mail-safe layouts. PNG is the safer pick for platforms that mangle inline SVG (some CMSes and chat apps), and JPG suits photo-like placeholders at small file sizes. The preview is identical in all three.
What are the size and color limits?
Width and height must be whole numbers between 1 and 5000 pixels; colors must be hex — #RRGGBB or the short #RGB form. Anything else is rejected with a hint rather than silently producing a broken image.
Is anything sent to a server?
No. The SVG is built from a string template in your browser and raster versions are drawn on a local canvas. Nothing leaves the page, so it works offline and is safe for unreleased designs.
Related tools
QR Code Generator
Turn any text or URL into a crisp QR code with adjustable size, colors and error-correction level — download as PNG or SVG.
All tools →
Base64 Image
Convert images to base64 data URLs and back — preview, validate and download, with an exact size comparison. Everything runs in your browser.
All tools →
Color Picker
Pick a color from the swatch or grab one straight from your screen with the EyeDropper API — hex, RGB and HSL copied in one click.
All tools →
Aspect Ratio Calculator
Given a ratio like 16:9 and one dimension, get the missing width or height instantly — plus presets from 1:1 to 21:9 for video and design.
All tools →
Embed this tool
Put this tool on your own site with one line — it runs entirely in the visitor's browser.
<iframe src="https://zoyku.com/en/tools/placeholder-image-generator?embed=1" width="100%" height="640" style="border:0;border-radius:16px" title="Zoyku — placeholder-image-generator" loading="lazy"></iframe>