Make a favicon from an emoji as an inline SVG data URL in a ready-to-paste link tag
SVG Placeholder Generator
Runs locally
Use SVG Placeholder Generator
What it does
Set the size, colors and an optional label to create a lightweight SVG placeholder for mock-ups. You get a preview, the SVG code and a data URI.
It runs entirely in your browser: nothing you enter is uploaded.
Example
1200 px wide banner
1200<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="400" viewBox="0 0 1200 400"><rect width="100%" height="100%" fill="#1e293b"/><text x="50%" y="50%" dominant-baseline="central" text-anchor="middle" font-family="Inter,system-ui,sans-serif" font-size="50" fill="#94a3b8">1200 × 400</text></svg>Sets the width: Generate makes a 1200 × 400 SVG labelled 1200 × 400, with its SVG code and data URI.
FAQ
What does the generated SVG contain?
A rectangle filled with the background color and one centered line of text in the text color. The font size is an eighth of the shorter side, at least 12 px, using Inter if it is installed and otherwise the system sans-serif font.
Are there size or text limits?
The fields suggest 1 to 4000 pixels, and an empty or zero size falls back to 600 × 400. Long labels are not wrapped, so they can run past the edges.
Is the image hosted anywhere?
No. The SVG and data URI are generated in your browser; copy them into your project, nothing is uploaded.