SVG to PNG Converter

Free SVG-to-PNG converters have a nasty habit. You hand them a logo with a transparent background and they hand back a PNG with a solid white box baked in behind it, sometimes black instead. Your see-through graphic now carries an opaque rectangle you can't get rid of, and you usually don't spot it until it's already sitting on a colored page somewhere. This tool keeps the transparency by default instead, turns your SVG into a crisp PNG right here in your browser, and hands it back in about a second, with no upload, no sign-up and no watermark on the way out.

It also opens on 2x, so the PNG looks clean on phone and retina screens instead of soft. The box and the blur are the two things the cheap converters get wrong, and fixing both is the reason this page exists. More on each below, plus the sizing quirk that trips up about half the SVGs people paste in.

1. Load your SVG. Click the box to pick a .svg file, or paste the raw markup into the text area. It parses the instant you drop it in and shows the intrinsic size, the width and height the file thinks it is.
2. Choose an output size. 1x, 2x, or 3x the intrinsic size, or switch to Custom width and type an exact pixel width (the height follows on its own to hold the aspect ratio). It defaults to 2x because that's what looks right on most screens today.
3. Decide about the background. Left unchecked, transparent parts stay transparent. Tick Fill the background and pick a color only if the destination needs something solid behind the artwork.
4. Convert, then download. You get a preview sitting on a checkerboard, so you can actually see whether the transparency survived, plus the exact pixel dimensions and file size. One click saves it as yourname.png.

Once the page has loaded it runs offline, since the conversion happens in your browser rather than on a server.

This is the failure I built the tool around. A PNG can hold a full alpha channel, so every pixel can be solid, see-through, or anything in between, exactly like an SVG. A transparent SVG should come out a transparent PNG, full stop. Plenty of converters get this wrong. They paint the whole frame with a color before drawing anything, and your logo lands on top of that filled rectangle. Drop it onto a dark page afterward and the box shows up like a stain.

Here the behavior is reversed. The frame starts completely empty and paint only lands where your SVG actually draws, so the see-through areas stay see-through. That's why the preview sits on a gray-and-white checkerboard instead of a plain white card. You can confirm the transparency made it before you commit to the download. When you genuinely do want a backdrop, because the destination can't handle transparency or you need a solid tile like a white app-icon square, tick the box and pick the color. It stays off by default because keeping the alpha is what most people came here for and rarely get.

The other thing the cheap converters botch is resolution, and it's quieter because the file looks fine until it's on a real screen. An SVG stores instructions, not pixels, so it can be drawn at any size and every size is sharp. A PNG is the opposite, a fixed grid of colored dots. So the real decision here is how many pixels you want in the finished PNG.

Say your SVG is 200x80, a small logo. Export it at 1x and you get a 200x80 PNG. On an old monitor that's fine. But almost every phone and modern laptop now packs two or more physical pixels into each layout pixel, the thing people call retina or high-DPI. Show that 200x80 image in a 200x80 slot on one of those screens and it gets stretched across four times as many pixels, so the edges go soft next to the crisp text around it.

The fix is to draw more pixels up front. A 2x screen wants a 400x160 image shown in a 200-pixel box, a 3x phone wants 600x240. Because the source is vector, asking for those extra pixels costs nothing in quality, you're just telling the tool to draw more dots from the same original. The tool redraws the shape from the vector at the bigger size, so it stays sharp. Blowing up a small PNG would just blur it further. For an app icon or anything headed to print, go bigger still with the Custom width box: type 1024 and you get a PNG exactly 1024 pixels wide, the height following to keep the shape.

About half the SVGs people paste in have no width or height at all. Icons pulled from Figma, from an icon set, from an illustration export, very often carry only a viewBox and nothing else, and a lot of converters choke on that and spit out a thumbnail or a wildly oversized image. This one reads the size in order: explicit width and height first, then the viewBox when those are missing, then nothing.

The viewBox case is the one worth understanding. It's four numbers, minX minY width height, so viewBox="0 0 100 50" means an intrinsic size of 100x50, and at 2x your PNG comes out 200x100. Reading it is what lets a Figma icon with no dimensions convert at the right shape instead of collapsing. If a file has no width, no height, and no viewBox, it genuinely has no defined size, so rather than invent a number the tool tells you and asks you to add one. That's a problem in the file, and a random guess would only hand you the wrong output silently. Percentages get the same care: width="100%" is measured against a container that doesn't exist here, so the tool falls back to the viewBox for real numbers instead of rendering something broken.

Both come from the same security rule the browser applies while drawing an SVG, and both have a quick fix. If your SVG contains live text set in a particular font, the browser generally can't fetch that font mid-render, so the text falls back to a default, shifts, or comes out wrong. The fix is upstream: in Figma, Illustrator, or Inkscape, choose Outline text or Convert to paths before exporting. That turns every letter into a plain shape with no font attached, and it renders identically anywhere. If your PNG text looks off, this is nearly always why.

The second one is external references. If the SVG links to a photo or a stylesheet by web address, the browser blocks it for anti-tracking reasons and it won't appear in the PNG. It's the same safeguard that keeps this tool off the network entirely. Embed the image inside the SVG instead of linking to it and it converts cleanly.

Most of the free converters ship your file up to a server you've never heard of, convert it there, and send it back. That is harmless for a public logo. For an unreleased brand mark or a client's confidential artwork, that's your file sitting on a stranger's disk. Here, reading the file, working out its size, drawing it, and building the PNG all happen inside your own browser. Nothing is transmitted, logged, or kept, which you can check by opening the Network tab and watching for requests while you convert. There aren't any, and that's also why it keeps working with your wifi off.

One honest caveat. If the graphic is staying on the web, in a site or app that already supports SVG, converting to PNG is a step backward, you lose the infinite scaling and CSS styling to solve a compatibility problem you don't have. Convert when something downstream actually rejects SVG, which is email, most social platforms, app stores, marketplace listings, and older office docs. For a different raster afterwards, the Image Format Converter takes your PNG onward to JPEG or WebP, and the Image Compressor shrinks a heavy 3x export without changing its dimensions.