SVG Preview & Export

What it's for

Preview SVG code or files, check their size, and export them as PNG, JPEG or WebP at any resolution.

• When you have an icon or logo as SVG code and want to see it.
• When you need a PNG of an SVG at a particular size for an app icon, a favicon or a document that doesn’t support SVG.

How to use it

Paste SVG code, which is syntax-highlighted, or choose or drop a .svg file. The preview shows it on a checkerboard, white, black or page background, with its size from width and height or the viewBox. To export, choose a format and a size: set the width and height, or use the scale buttons (1× to 4×) or the fixed widths (64 to 1024). You can fill the background with a colour, set the quality for JPEG and WebP, and name the file before choosing Export.

Example

Paste this:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#0798F5"/></svg>

The tool reports 24 × 24 (from its viewBox). Shown enlarged. Choose PNG, click 512 and choose Export to get a sharp 512 × 512 image of a blue circle.

Good to know

The preview and export treat the SVG as an image, so scripts don’t run, and linked files and web fonts don’t load. Embed images as data: URLs and use system fonts. JPEG has no transparency, so it’s always filled. Exports are limited to 16,384 pixels a side.