Design simple SVG shapes for icons, illustrations and web graphics. Choose a shape, set the colours and size, preview it live, then copy the SVG code or download it as a file.
How to Use
- Choose a shape from the dropdown.
- Set the fill colour, stroke colour, stroke width and size — the preview updates live.
- Click Copy SVG to grab the code, or Download .svg for the file.
- Paste the code into your HTML or open the file in any vector editor.
Key Features
- Seven shapes — circle, square, rounded square, ellipse, triangle, star and hexagon.
- Live preview — every control updates the shape instantly.
- Copy and download — SVG code plus a downloadable .svg file.
- Resolution independent — scales cleanly to any size.
- 100% private — runs entirely in your browser; nothing is sent or stored.
FAQs
What can I use the SVG for?
Icons, illustrations, backgrounds and web graphics. SVG scales without losing quality, so one file works at any size.
Can I edit the code afterwards?
Yes — the output is standard SVG. Tweak colours, sizes or points in any text or vector editor.
How do I save the shape as a file?
Click Download .svg to save a shape.svg file you can open in a browser or vector editor.
Is my design sent anywhere?
No. The generator runs entirely in your browser and never transmits or saves your design.
Related Tools
Try these related tools: Placeholder Image Generator, Favicon Generator and Color Picker.