How to convert SVG to PNG
- Drop an .svg file on the input or click it to choose one. To paste markup instead, choose SVG code and paste it into the box.
- Pick a size: 1×, 2×, 4× or 8× the SVG’s own size, or Custom to type a width or a height in pixels. The other side follows, so the image is never stretched.
- Leave the background transparent, or choose Color and pick the color that fills the empty areas.
- Check the preview (switch it to the dark surface to check a white logo), then click Download PNG. The file is named after the SVG, so logo.svg downloads as logo.png; pasted or edited code downloads as image.png.
Why use this tool
Logos where SVG is not accepted
Email signatures, slide decks, app store listings and many upload forms take PNG but not SVG. Export at 2× or 4× so the logo stays sharp on high-density screens.
Images at an exact width
A blog, a docs site or a social post needs a diagram 1200 px wide. Choose Custom, type 1200 as the width, and the height is worked out from the SVG’s own proportions.
Icons from code
Copied an icon’s markup from an icon set, a design tool or your codebase? Choose SVG code, paste it and download a PNG, without saving an .svg file first.
Checking an SVG before you ship it
The notices flag an SVG with no size of its own, and one that relies on web fonts or linked images, which will not load when the SVG is used as an image. Problems show up before the file goes into a build or a document.
Private by design
Your files are decoded and converted in this browser tab and never uploaded, so client artwork and unreleased designs stay on your device. No account and no watermark.
Good to know
How the size is chosen. The tool reads the root <svg> element. A width and height in pixels, or without a unit, set the size. If only one of them is set and there is a viewBox, the other is worked out from the viewBox proportions. Other units, such as in, mm, em or %, are ignored and the viewBox size is used instead. An SVG with no usable size and no viewBox is drawn at 512 × 512 px, with a notice. The 1×, 2×, 4× and 8× options multiply that size, rounded to whole pixels.
Sharp at any scale. The SVG is redrawn at the output size, not enlarged from a small bitmap, so edges and text stay crisp at 8×. Bitmap images embedded inside the SVG are the exception: they are scaled like any photo.
Transparency. Anything the SVG does not paint stays transparent in the PNG, and the preview shows those areas over a checkerboard. Choose Color to fill them with a solid color instead.
Fonts and linked files. The SVG is drawn as an image, and browsers do not let an SVG drawn as an image load anything from outside the file: web fonts brought in with @import or a font URL, linked images and external stylesheets are left out. Text then uses a font installed on your device, or a default one. Fonts and images embedded in the SVG as data: URLs still work. The tool shows a notice when the SVG would load a font, an image or a stylesheet from a web address (http, https or //), and it never fetches those addresses.
Limits. The largest PNG is 16,384 px on a side and 67 megapixels in total (for example 8192 × 8192 px). Beyond that browsers cannot reliably draw it, so the tool shows an error instead of producing a blank image. Files over 50 MB get a warning, as they can be slow to convert. Scripts inside an SVG do not run, and an animated SVG gives a single still image. Some browsers, Safari among them, refuse to export an SVG that holds HTML inside a <foreignObject> element; the tool then says so.
Rendering. The PNG is drawn by your browser’s own SVG renderer, so text antialiasing and a few rarely used SVG features can differ slightly between browsers.
In — SVG at 2×
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 120">…</svg>Out — PNG size
480 × 240 px| Root <svg> attributes | Size at 1× | Taken from |
|---|---|---|
| width="64" height="32" viewBox="0 0 240 120" | 64 × 32 px | width / height |
| viewBox="0 0 240 120" | 240 × 120 px | viewBox |
| width="480" viewBox="0 0 240 120" | 480 × 240 px | width / height |
| width="2in" height="1in" viewBox="0 0 240 120" | 240 × 120 px | viewBox |
| (no width, height or viewBox) | 512 × 512 px | fallback |
Frequently asked questions
Will the PNG be sharp at large sizes?
Yes. The SVG is redrawn at the output size rather than enlarged from a small image, so lines and text stay crisp at 8× or at a custom size. The only exception is a bitmap image embedded inside the SVG, which scales like any photo.
Why is my PNG 512 × 512 pixels?
Your SVG has no width and height in pixels and no usable viewBox, so nothing in the file says how big it is. The tool then uses 512 × 512 px and says so in a notice. Add a viewBox to the SVG for the right proportions, or choose Custom to set another size (it stays square, as the file gives no other proportions).
Why does the text in my PNG use a different font?
The SVG loads its font from the web, for example with @import or a font URL. Browsers do not load anything from outside an SVG that is drawn as an image, so the text falls back to a font on your device. Convert the text to outlines in your design tool, or embed the font in the SVG, before converting.
Does the PNG keep a transparent background?
Yes, unless you choose otherwise. Every area the SVG leaves empty stays transparent, shown as a checkerboard in the preview. Choose Color under Background to fill those areas with a solid color instead.
Is my SVG uploaded anywhere?
No. The file or the code you paste is read and drawn in this browser tab, and the PNG is created there too. Nothing is sent to a server, and web addresses inside the SVG are not fetched.
What is the largest PNG I can make?
Up to 16,384 px on a side and 67 megapixels in total, such as 8192 × 8192 px. Larger canvases fail in some browsers, so the tool shows an error and asks for a smaller size instead of saving a blank image.