0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0 1 0
Configuration
Convert an SVG to PNG or JPG choosing the output resolution: the vector is redrawn at the requested size, so the result stays sharp at any scale. You can upload a file or paste the SVG code. All processing happens in your browser, with no uploads.
Source

Drag an SVG file here or click to select one

SVG

How it works

SVG is a vector format: it describes shapes with coordinates, so it can be drawn at any size without losing sharpness. PNG and JPG, by contrast, are bitmaps with a fixed number of pixels. Rasterising is exactly that step: fixing a resolution and drawing the vector onto that pixel grid.

That is why the resolution is chosen before converting, not after. The tool rewrites the SVG width and height to the requested size and only then draws it, so the browser retraces the curves at that scale instead of enlarging a small image. You can give a multiplier (2×, 4×…) or an exact width and height in pixels.

PNG keeps transparency; JPG does not, so transparent areas are filled with the background colour you choose. All the drawing happens in your browser with Canvas: neither the file nor the SVG code is uploaded to any server.

Examples

<svg viewBox="0 0 24 24" width="24" height="24">…</svg>PNG 96 × 96 pxA 24 px icon converted with a 4× multiplier ends up at 96 × 96 px, the usual size for high-density screens.
<svg viewBox="0 0 1200 630">…</svg>JPG 1200 × 630 pxAn SVG without width and height attributes takes its size from the viewBox; here it is rasterised at 1× for a social media preview image.

Use cases

  • Produce the PNG icons required by app stores or web manifests, which do not accept SVG.
  • Convert a vector logo to PNG with a transparent background to drop it into a presentation or a document.
  • Export an SVG diagram or chart to JPG to attach it to an email or upload it to a platform that rejects vectors.
  • Get @2x and @3x versions of the same icon for high-density screens.
  • Produce the preview image (Open Graph) of a website from an SVG template.

Frequently asked questions

Which resolution should I choose?

The one the final use calls for. For ordinary screens the size at which the image will be shown is enough; for high-density screens 2× or 3× that value works better. For print, multiply the size in inches by 300 to reach 300 dpi.

Why does my SVG come out at an unexpected size?

The initial size comes from the width and height attributes; if they are missing or given as percentages, the viewBox ratio is used. When neither is present, the browser assumes 300 × 150 px. You can ignore that value and type an exact width and height in custom mode.

Is transparency preserved?

In PNG yes, as long as you leave the transparent background option ticked. JPG has no alpha channel, so it is always drawn over a solid colour: white by default, though you can change it.

Why does an SVG that uses external images or fonts fail?

When drawn inside an image, the SVG cannot download resources from other domains and the browser blocks the export for security reasons. The fix is to embed those resources in the SVG itself: images as data URIs and text converted to paths.

Can I go back from PNG to SVG?

Not directly: rasterising discards the vector information and leaves only pixels. Recovering the curves requires a tracing process that rebuilds approximate shapes, not the original. It is always worth keeping the source SVG.

See also