Preview, inspect and edit SVG files online – instantly, in your browser.
Tip — drag & drop a .svg file anywhere on the tool to load it instantly.
Your rendered SVG appears here. Scroll to zoom, drag to pan.
An SVG file is really just text. Open one in a plain editor and you'll find a wall of angle brackets describing paths, circles and colours – nothing that means much to your eyes until something actually draws it. That's the whole job of this page. You drop in the code (or the file), and the picture shows up right next to it.
We kept the layout deliberately plain: an editor on one side, a live canvas on the other. Change a fill colour, nudge a coordinate, delete a stray path, and the preview keeps pace with every keystroke. No save button. No refresh. Nothing waiting on a server somewhere across the country.
And whatever you paste stays put. The rendering happens inside your own browser, so a logo you're not ready to show the world stays exactly that – unshared. Designers lean on it to sanity-check an export from Figma or Illustrator. Developers use it to work out why an icon keeps rendering blank. And plenty of people just want a fast answer to one small question: what does this file actually look like?
Once a graphic looks right, shrink it with our SVG Optimizer, or export it as a raster image with the SVG to PNG and SVG to JPG converters.
.svg file anywhere onto the tool, or click Open SVG File.viewBox – and the preview updates live..svg file.SVG stands for Scalable Vector Graphics. Unlike a JPEG or PNG, which store a fixed grid of pixels, an SVG stores instructions written in XML – draw a line here, fill this shape with that colour, curve a path between these points. Because the browser redraws those instructions on demand, the image stays razor-sharp at any size, from a 16-pixel favicon to a billboard. That's exactly why logos, icons and illustrations on the modern web are so often SVGs: one small text file that never goes blurry.
viewBox and dimensions before you embed an SVG in a page.An SVG (Scalable Vector Graphics) file is an image described with XML code rather than a grid of pixels. The code lists the shapes, paths and colours that make up the picture, so the browser can redraw it at any size without losing quality. That makes SVG ideal for logos and icons.
PNG and JPG are raster formats – they store a fixed number of pixels, so they blur or pixelate when you scale them up. SVG is a vector format that stores drawing instructions, so it stays sharp at any size and the file is usually tiny for simple graphics. PNG and JPG are the better fit for photographs.
Yes. Click Open SVG File or drag a .svg file onto the page, and the viewer renders it straight away. The code still loads into the editor in case you want it, but you never have to touch it.
You can. This is a viewer and a basic editor in one. Edit the XML in the panel on the left and your changes show up in the live preview on the right – handy for quick colour, text or shape changes without opening a design program.
For security, the viewer renders your SVG inside a sandboxed image element, which means any embedded JavaScript (<script> tags) is ignored. This prevents cross-site scripting (XSS) and keeps the tool safe. It's built to show how a graphic looks, not to run its interactive code.
Completely. The tool renders everything in your own browser with JavaScript – your code and files are never uploaded to our servers. Whatever you paste here stays on your device.
Yes. The layout stacks the editor and preview on smaller screens, and you can pinch or use the zoom controls to inspect detail on a phone or tablet.