SVG Viewer and Editor

SVG files are code, so a viewer that only shows the picture misses half the story. Open or paste an SVG here to see it rendered, read its declared size and viewBox, count its elements, and get the code back pretty-printed for editing or minified for production. Change the code in the box and run it again to see the edit. Scripts, event handlers and external links can be stripped first, because an SVG opened on its own can run JavaScript. Nothing is uploaded.

How to use this tool

1. Choose an SVG file, or paste SVG code into the box.
2. Pick a code layout: pretty-print, minify or keep.
3. Leave the safety option on for files you did not make.
4. Read the preview, size, viewBox and element table; copy the code.
5. Edit the code in the box and run again; optionally export a PNG at any width.

Formula

displayed size = width × height attributes (px, pt, mm, cm, in converted at 96 px per inch); if one is missing it follows the viewBox ratio

An SVG with only a viewBox has no fixed size: it scales to whatever box it is placed in. The PNG export sets the width you choose and derives the height from the viewBox (or from width and height), so the picture is drawn sharply rather than enlarged from a small bitmap.

Example

An icon written as <svg width="2in" viewBox="0 0 40 20"> is 2 × 96 = 192 px wide; the viewBox ratio 20 ÷ 40 makes it 96 px tall. Exporting it as a PNG at 1024 px gives a 1024 × 512 image.