BROWSER TOOL

SVG editor Free

Edit SVG code with a safe live preview, adjust viewBox, size, fill and stroke, strip comments and metadata, then export SVG or PNG.

Processed on your device · your files are never uploaded

Size and viewBox

width

height

viewBox (min-x min-y width height)

Responsive removes width and height so the SVG scales to its container.

Fill and stroke colours

Replace

With

Optimise

Also remove <title>Also remove <desc>Titles and descriptions give screen readers a name for the image; keep them for meaningful graphics.

Export PNG

Solid background

SVG code782 B · drop a file here

Rendering…

Previewed as an image: scripts, external images and web fonts inside the SVG do not run or load.

782 B240 × 240 · viewBox 0 0 240 24015 lines

About SVG editor

SVG editor is a code-first workspace for icons and illustrations. Paste or open an SVG, edit the markup and watch the preview update. The preview renders the SVG as an image, so any scripts or event handlers inside the file never run.

Quick controls change the viewBox, width and height, and replace fill or stroke colours throughout the file. The optimiser removes comments, metadata, editor-specific attributes and extra whitespace, and shows how many bytes you saved. Export the result as an SVG file or a PNG at the size you need.

How to use it

Paste SVG code, open an .svg file, or start from the sample.
Edit the code or use the quick controls for size, viewBox and colours.
Press Optimise to strip unneeded content, and compare the before and after sizes.
Copy the code, download the SVG, or export a PNG.

Good to know

SVG files up to 2 MB. The optimiser uses safe, text-level clean-ups; it does not rewrite path data or merge shapes like dedicated optimisers do.
Because the preview is shown as an image, external images, web fonts and scripts referenced by the SVG are not loaded.
Colour replacement matches literal colour values; colours set through CSS classes inside a <style> element may need editing by hand.

Questions and answers

Is it safe to paste an SVG from the internet?

The preview is displayed through an image element, where browsers never run SVG scripts or load external resources. The code stays as text you can read before using it.

What does the optimiser remove?

XML comments, the XML declaration and DOCTYPE, <metadata>, editor-specific namespaces and attributes (Inkscape, Sodipodi, Sketch, Affinity and Illustrator), empty groups and redundant whitespace. <title> and <desc> are kept unless you choose to remove them, because screen readers use them.

Why does my PNG export look different?

Fonts and linked images are not loaded in image mode, so text may fall back to a system font. Convert text to paths in your design app for an exact match.