SVG viewer
Paste SVG code or open a file and see it render — on light, dark, or transparent.
By opening this website or using its tools, you agree to our Terms and Privacy Policy.
or drag it here
SVG file
Your file never leaves your browser during processing
How it works
To preview an SVG, paste its code or drop the file onto this page — it renders immediately in your browser against a light, dark, or checkerboard background, alongside its dimensions, viewBox, and element counts, and if it fails to parse the XML error is shown with the line it came from.
Opening an .svg file directly usually gives you either a code editor or a browser tab where the drawing is stranded in the top-left corner at whatever size the file specifies. Neither answers the questions you actually have: does this render, how big is it, and does it look right on the background it is going onto.
The preview renders your file through an image element rather than injecting it into this page. That matters for a viewer more than anywhere else, because a viewer is where you paste code you did not write. An SVG placed inside a page with innerHTML can carry a script element or an onload attribute that executes immediately; an SVG in an image element cannot — scripts do not run and external references are not fetched. Scripts and handlers are also stripped before rendering, so the sandbox is not the only line of defence.
The three backgrounds exist because transparency is invisible on white. A logo with a white fill and a transparent background looks identical to one with a white background until you put it on a dark surface, at which point one of them disappears. The checkerboard shows which you have.
When a file does not render, the parse error is shown as the browser’s own XML parser reported it. SVG is XML, not HTML, so it has none of HTML’s tolerance: one unclosed tag, one stray ampersand, or a missing namespace and the entire document fails rather than degrading. That message names the line, which is normally enough to find the problem immediately.
FAQ
Is it safe to paste SVG code from an unknown source here?
Safer than most places you could paste it. Scripts and event handlers are removed before rendering, and the preview uses an image element, where a browser will not execute scripts inside the SVG or fetch anything it references.
Why does my SVG show as an error?
SVG is XML and has to be well-formed: every tag closed, ampersands escaped, and the xmlns attribute present for a standalone file. The exact parse error from your browser is shown, including the line it failed on.
Why is my SVG rendering at the wrong size?
Check the width, height, and viewBox values shown under the preview. A file with fixed width and height but no viewBox cannot scale, which is the most common cause. The viewBox fixer tool diagnoses and repairs that.
Can I edit the code and see it update?
Yes. The code box stays editable and the preview re-renders as you type, which makes it a quick way to test a change to a path or a fill.