SVG Placeholder Generator
Generate a placeholder image as inline SVG, a data URI, or a file.
Runs entirely in your browser.
Generate an SVG Placeholder Image
About SVG Placeholder Generator
An SVG placeholder is a few hundred bytes of text rather than an image file, so it can be embedded straight into the HTML or a stylesheet as a data URI - no request, no round trip, and it stays crisp at any size because it is vector.
That makes it a better fit than a raster placeholder for layout work and component libraries: paste the data URI into a mock-up and the box has the right dimensions immediately, with the size printed on it so you can see what is what.
For a raster placeholder - a real PNG or JPG at a fixed pixel size, which some tools insist on - use the Placeholder Image generator instead.
Other Developer Utilities
- JavaScript Key Code Info — event.key, code and keyCode
- Online Stopwatch — with lap times
- Docker Run to Compose — convert a run command
- ASCII Text Art — large letters for banners
- Device Information — screen, browser and capabilities
- Placeholder Image — a raster PNG or JPG placeholder
- User Agent Parser — break down a UA string
- Responsive Tester — preview a page at many sizes
- Dockerfile Generator — build a Dockerfile
- Live Code Preview — edit HTML, CSS and JS together
