SVG Viewer
Paste SVG code or open a file to preview it on light, dark or transparent backgrounds. Zoom in, inspect the viewBox, minify, and download as SVG or PNG.
Open source on GitHubSVG code
Preview
Runs entirely in your browser. SVG code is previewed as an image, so scripts inside it never run, and nothing is uploaded.
SVG size attributes. What controls how an SVG is sized and scaled.
| Attribute | What it does | Notes |
|---|---|---|
| viewBox | The coordinate system: min-x, min-y, width and height of the drawing | Without it the SVG can’t scale cleanly; keep it |
| width / height | The default display size | Optional when CSS sets the size; without both, browsers use 300×150px |
| xmlns | Marks the file as SVG | Required when the SVG is used as an image file or data URL |
| preserveAspectRatio | How the drawing fits when the box has a different ratio | Default xMidYMid meet centers and fits the whole drawing |
What minifying removes. Safe cleanups that don’t change the drawing.
| Part | Example | Result |
|---|---|---|
| Comments | <!-- Generator: … --> | Removed |
| XML prolog and doctype | <?xml version="1.0"?> <!DOCTYPE svg …> | Removed (not needed in browsers) |
| Metadata | <metadata>…</metadata> | Removed |
| Whitespace between tags | Indentation and line breaks | Collapsed |
| Inline CSS and scripts in CDATA | <![CDATA[ … ]]> | Kept unchanged |
More free tools. Free, open source, no sign-up. See all tools · Source on GitHub
Frequently asked questions
How do I view an SVG file?
Click Open SVG and pick the file, drop it on the code panel, or paste the SVG markup. The preview updates as you type, and you can switch between a transparent grid, white and dark backgrounds to check how it looks in light and dark themes.
Is it safe to open an untrusted SVG here?
Yes. SVG files can contain scripts, so this viewer never injects the markup into the page. It renders the SVG as an image from a local blob URL, and browsers don’t run scripts or load external resources in SVGs shown as images.
Why does my SVG show at 300×150?
An SVG without width and height attributes, and without a viewBox to infer them from, gets the browser default size of 300×150 pixels. Add a viewBox (and width and height if you want a default display size).
What does Minify remove?
Comments, the XML prolog, doctype, metadata blocks and whitespace between tags. It doesn’t rewrite paths or remove attributes, so the drawing looks the same. For deeper optimisation, use a dedicated tool such as SVGO.
Can I convert the SVG to PNG?
Yes. Pick 1x, 2x or 4x below the preview and click Download PNG. The PNG keeps transparent areas. For batch conversion, use the SVG to PNG converter.