QuickieTool

SVG to PNG Converter

Rasterise an SVG to a PNG at any size, with a transparent or white background. Runs in your browser — your file is never uploaded.

About SVG to PNG

SVG to PNG renders a vector file to a pixel image at whatever size you need. Because the source is vector, you can export at 10× with no loss of sharpness — the shapes are redrawn at the target size rather than scaled up from a smaller bitmap.

The reason to convert at all is compatibility. SVG is the right format for logos and icons on the web: one file stays crisp at every screen density and usually weighs less than a bitmap. But plenty of destinations will not take it — email clients strip it, older CMSs reject it, social platforms and app stores require raster uploads, and design tools sometimes want a flat image. A PNG solves those without giving up quality, provided you export at the size you actually need.

Which is where scale matters. A 200-pixel logo exported at 1× looks soft on a modern high-density display, where one CSS pixel is two or three device pixels. Exporting at 2× or 3× and letting the destination scale it down gives a sharp result. Because the render happens from vector data each time, a 10× export is genuinely detailed rather than an upscaled blur.

One real limitation, stated plainly: conversion happens locally with the SVG inlined, which means anything the file merely references — a remote image via href, an external webfont, a stylesheet — cannot be fetched and will not appear. If your export is missing text or pictures, that is the cause. Converting text to outlines and embedding images as data URIs in your design tool fixes it before you export.

How to convert SVG to PNG

  1. Drop in your .svg file.
  2. Check the detected dimensions shown beneath the file name.
  3. Choose a scale — the resulting pixel size is shown as you move the slider.
  4. Decide whether the background should be transparent or white.
  5. Click Convert to PNG and the file downloads.

Tips & common problems

Export at 2× or 3× for screens

High-density displays map one CSS pixel to two or three device pixels. Exporting larger and letting the destination scale down is what keeps an icon crisp.

Choose white if the destination has no alpha

Transparent PNGs can composite badly where transparency is unsupported, often showing black fringes. If you know the background, bake it in.

Outline your text before exporting

A webfont referenced by the SVG cannot be loaded during conversion, so text can shift or vanish. Converting text to paths in your design tool makes it render exactly as drawn.

A viewBox-only SVG still works

Files exported by design tools often omit width and height. The dimensions are taken from the viewBox instead, so it converts at the correct proportions.

Frequently asked questions

Will the PNG be blurry?

No, provided you pick an adequate scale. The image is redrawn from the vector at the target size, so a 10× export is genuinely sharp rather than an enlarged bitmap.

Is my file uploaded?

No. The SVG is read and rendered entirely in your browser, which matters for unreleased logos and brand assets.

Why is text missing from my PNG?

The SVG most likely references an external webfont, which cannot be fetched during local conversion. Convert the text to outlines in your design tool and export again.

Why is an embedded picture missing?

For the same reason — an <image> element pointing at a remote URL cannot be loaded. Embed it as a data URI in the SVG first.

What size should I export?

Two to three times the display size for screens. For print, work from the physical size and target 300 DPI.

Can I keep the transparent background?

Yes, transparency is preserved by default. Untick it to composite the artwork onto solid white instead.

Related tools