Skip to content
Pixgrain

Convert SVG to PNG

Renders SVG vector graphics to PNG at whatever size you need. Transparency is preserved; scalability is not.

How to convert SVG to PNG

  1. Drop your SVG files into the box above, or click to browse. You can also paste with Ctrl+V.
  2. Adjust quality or resizing under Conversion settings if you need to. The defaults suit most photos.
  3. Conversion starts automatically and runs on your device — watch the progress bar for each file.
  4. Download files individually, or grab everything as a ZIP.

What changes when you convert SVG to PNG

An SVG is a description, not an image. It says "draw a circle here, fill this path with that gradient, set this text in this typeface". Nothing has a pixel size until something draws it, which is why an SVG logo stays perfectly sharp whether it is a favicon or a billboard.

Rasterising to PNG executes that description once, at one size, and keeps the result. Everything after that is fixed. Enlarge the PNG afterwards and it blurs, exactly like any other bitmap.

That makes output size the decision that matters here, and SVG makes it genuinely ambiguous. If the file declares explicit width and height attributes, those are used. If it only declares a viewBox — which is very common for icons and logos — there is no intrinsic size at all, so this tool renders it to 1024 pixels on the longest edge, which suits most icon and logo use. Whatever you pick, render at least at the size the image will be displayed, and preferably at twice that for high-density screens.

Two things do not survive, and both catch people out.

The first is text. An SVG that sets type in a font referenced by name — "Helvetica Neue", say — is relying on the machine doing the drawing to have that font. Rendering here happens entirely inside your browser with no access to system fonts, so text referenced that way does not render at all rather than rendering in something approximate. Convert text to outlines in your design tool before exporting and the problem disappears permanently: the letters become shapes, and shapes always render. That is worth doing regardless of which tool you use, because a font the viewer lacks was never going to look right anywhere.

The second is external images. An SVG can reference a bitmap by URL, and this tool fetches nothing — that is the point of running locally. If your SVG depends on a remote asset, that asset will be missing from the output. Embed it as a data URI, or export a flattened version.

Animation and interactivity are also gone. SVG can animate through SMIL or CSS and respond to script; PNG is one still frame.

What is preserved

  • Transparency — SVG backgrounds are transparent by default and PNG carries the alpha channel
  • Colours, gradients and shapes exactly as a browser draws them
  • Crisp edges, provided you render at or above the size the image will be displayed at

What is lost

  • Scalability: the output is fixed pixels and will blur if enlarged afterwards
  • Text as text — glyphs become shapes and then pixels, so nothing is selectable
  • Animation and interactivity: SMIL animation, CSS transitions and script are not executed
  • The ability to recolour the artwork by editing the file

What is altered

  • Text set in a font referenced by name does not render at all — there are no system fonts to fall back on
  • External images referenced by URL are not fetched, because the renderer makes no network requests

PNG support in browsers and operating systems

Checked on 2026-08-10. We re-verify this table every quarter.

PlatformSupport
Chromeall versions
Safariall versions
Firefoxall versions
Edgeall versions
iOSall versions
Androidall versions
Windowsall versions since 98
macOSall versions

When not to convert SVG to PNG

Do not convert if the destination reads SVG. Every browser has for well over a decade. Rasterising a logo for a web page throws away sharpness on high-density displays and usually makes the file larger.

Do not convert for favicons and app icons without thinking about sizes. Those need several specific dimensions, and a favicon generator that produces the full set is the right tool rather than one PNG.

Do not convert if you might need to recolour or edit the artwork later. In SVG a brand colour is one attribute to change; in PNG it is a repaint.

Do not rasterise at a small size hoping to enlarge it afterwards. Render at the largest size you will ever need — going up from a bitmap never works, going down always does.

Frequently asked questions

What size will my PNG be?

If the SVG declares width and height, those are used. If it only has a viewBox — common for icons and logos — there is no intrinsic size, so it renders to 1024 pixels on the longest edge. Render at least as large as the image will be shown, and ideally twice that for high-density displays.

Why is the text missing from my PNG?

Because the SVG references the typeface by name and rendering happens entirely in your browser, with no access to system fonts. Rather than substituting something that would look wrong, the renderer draws nothing. Convert text to outlines or paths in your design tool before exporting — the letters become shapes, and shapes render identically everywhere.

Why is part of my image missing?

Most likely the SVG references an external image by URL. This tool makes no network requests at all — that is the point of running in your browser — so remote assets are not fetched. Embed them as data URIs in the SVG, or export a flattened version from your design tool.

Does the transparent background survive?

Yes. SVG backgrounds are transparent unless the file draws one, and PNG carries a full alpha channel, so transparency crosses over exactly. If you convert to JPG instead, it will be filled with a solid colour, because JPEG has no alpha channel.

Can I convert a PNG back to SVG?

Not meaningfully. Going from vector to pixels discards the shape descriptions permanently. Tracing tools can approximate outlines from a bitmap, but the result is a guess rather than your original artwork — keep the SVG.