About the SVG to PNG Converter
This SVG to PNG converter rasterizes vector graphics into PNG images at exactly the size you need. Paste SVG markup or upload an .svg file, choose a scale (2× and 4× for retina screens) or an exact width or height, pick a transparent or solid background, and download the PNG. The calculator also reads the SVG’s intrinsic size from its width, height and viewBox so you know the exact output dimensions before you export.
It is handy for designers exporting icons and logos for apps, slides and social media, developers producing fallback images or app-store assets, and anyone who needs a raster image for a tool that does not accept SVG. Conversion happens entirely in your browser — files are never uploaded.
Because SVG is vector, scaling up loses no quality: a 24px icon exported at 512px is perfectly sharp. Output is limited to 8192px on the longest side to stay within desktop browser canvas limits; Safari on iPhone and iPad caps a canvas at about 16.7 megapixels (4096 × 4096), so keep very large exports for desktop. External images and web fonts referenced by the SVG may not render; embed them or convert text to outlines for faithful results.
How to use the svg to png converter
- 1Paste your SVG code into the box, or upload an .svg file.
- 2Choose a scale factor, or set an exact width or height in pixels.
- 3Leave the background blank for transparency or enter a colour such as #ffffff.
- 4Check the preview and output dimensions.
- 5Click Download PNG to save the image.
Formula and method
The intrinsic size comes from the root element’s width and height attributes, converted to CSS pixels at 96 per inch (1in = 96px, 1pt = 1.333px, 1mm = 3.78px). If only one is set, the other follows the viewBox proportions; with no size at all the viewBox width and height are used, and with neither the browser default of 300 × 150 applies.
The output keeps the same aspect ratio: a scale factor multiplies both sides, while an exact width or height derives the other side from the ratio. Results are rounded to whole pixels and capped at 8192px on the longest side. The uncompressed size is four bytes (red, green, blue, alpha) per pixel — the memory the browser needs — while the downloaded PNG is compressed losslessly.
- scale
- Multiplier applied to the SVG’s intrinsic size
- viewBox
- SVG coordinate box: min-x, min-y, width, height
Worked examples
120 × 60 logo exported at 4×
The SVG declares width 120 and height 60, so a 4× export is 480 × 240 px. That is 115,200 pixels, or 0.4608 MB of raw RGBA data before PNG compression.
24px icon with only a viewBox, exported 512px wide
With no width or height attribute the 24 × 24 viewBox defines the size. Asking for 512px wide keeps the 1:1 ratio, so the PNG is 512 × 512 px — still perfectly sharp.
Print-sized SVG in inches at 3×
CSS defines 1 inch as 96px, so a 2in × 1in SVG is 192 × 96 px. Tripling it gives a 576 × 288 px PNG.
Oversized request is capped at 8192px
4 × 3000 = 12,000px exceeds the 8192px canvas limit, so both sides are scaled down proportionally to 8192 × 4096 px.
Frequently asked questions
How do I convert SVG to PNG without losing quality?+
Export at the size you will display it, or larger. Because SVG is vector, rendering it at 2× or 4× produces a crisp PNG with no blur; only upscaling the PNG afterwards loses quality.
Can I keep a transparent background?+
Yes. Leave the background field blank and transparent areas of the SVG stay transparent in the PNG. Enter a colour such as #ffffff if you need a solid background.
Is my SVG uploaded to a server?+
No. The SVG is drawn onto a canvas in your browser and the PNG is created locally, so your file never leaves your device.
Why does text look different in the PNG?+
Browsers will not load web fonts or external images while rasterizing an SVG for security reasons, so text falls back to installed fonts. Convert text to outlines or embed the font as a data URI to keep it identical.
What size should I export app icons or favicons at?+
Export each required size directly — for example 512 × 512 for PWA icons and 180 × 180 for Apple touch icons — rather than resizing one PNG, so every size is rendered sharply from the vector.