SVG to PNG Converter
Last updated: 27 June 2026
Reviewed by Gavin Meiring, Lead research and primary author ยท Doctoral Candidate (Corporate Governance) ยท Research and drafting assisted by AI
Drag and drop an SVG file, or click to browse
- SVG became a W3C standard in 2001 after a browser war of its own: Adobe's PGML and Microsoft's VML proposals were merged to create the format we use today.
- The first vector graphics program was Ivan Sutherland's Sketchpad, demonstrated at MIT in 1963 โ its mathematical 'rubber band' lines laid the groundwork for every drawing tool since.
- Converting SVG to PNG is called 'rasterisation': the math behind each curve is sampled into a grid of pixels, and anti-aliasing softens the edges so lines do not look jagged.
SVG to PNG Converter
SVG (Scalable Vector Graphics) is the ideal format for logos, icons, and illustrations because it scales perfectly at any size. But many platforms, apps, and systems do not support SVG and require a raster format such as PNG. This free SVG to PNG converter renders your SVG at any resolution and exports a crisp, transparent PNG.
How to Use the SVG to PNG Converter
- Upload your SVG file or paste SVG code directly into the text input.
- Set your desired output width in pixels (the height adjusts proportionally by default).
- Optionally release the aspect-ratio lock to set both width and height independently.
- Choose a background colour or keep it transparent.
- Click Convert and download your PNG file.
The Formula
The conversion process renders the SVG in a virtual canvas at the specified pixel dimensions, then exports the canvas as a PNG bitmap.
SVG is a vector format: shapes, paths, text, and fills are described mathematically as XML, and can be drawn at any resolution without loss. PNG is a raster format: a fixed grid of pixels stored using DEFLATE lossless compression. Conversion is one-directional (vector to raster); you cannot recover the original SVG mathematics from a PNG.
The output quality depends entirely on the resolution you request. Rendering an SVG at 200x200px produces a 200px PNG. Rendering the same SVG at 2000x2000px produces a PNG that is 10 times larger in each dimension and 100 times larger in pixel count, with correspondingly sharp, smooth edges. The SVG is rendered by a browser engine (the tool uses an HTML5 Canvas element), ensuring accurate colour reproduction, font rendering, and CSS styling support.
Real-World Example
You have a company logo as an SVG file, typically at a notional size of 100x40px in the SVG code. You need a PNG for a PowerPoint presentation header area that is 600x240px.
Set output width to 600px. The tool calculates the height proportionally: 600/100 x 40 = 240px. The rendered PNG is 600x240px with crisp edges and full transparency where the SVG background was transparent. Insert this PNG into PowerPoint without any blurriness.
For a print business card at 300 DPI on a 90x50mm card (roughly 1063x591px at 300 DPI), set width to 1063px. The SVG renders at that resolution, giving you a print-quality PNG.
When to Use SVG vs. PNG
Use SVG when: the image is a logo, icon, diagram, chart, or illustration; the platform supports SVG (modern browsers, many design tools, most email clients do not); you need the image to scale without loss; you want to edit colours or shapes in the future. Use PNG when: the platform does not support SVG; you need to embed the graphic in a document (Word, PowerPoint, PDF); you are submitting to a web platform or app that requires raster input; you need to use the image on social media or in email templates. As a rule, keep the SVG original and generate PNGs at the specific resolutions needed for each output.
Frequently Asked Questions
Why does my SVG look blurry in some applications? SVG files are vector-based and should always appear sharp. If an SVG looks blurry in an application, the app is likely rasterising it at screen resolution (72 DPI) before displaying it, which makes it appear blurry when printed or zoomed in. Exporting to PNG at the correct resolution for the intended use solves this.
My SVG uses custom fonts. Will they appear in the PNG? Only if the fonts are embedded or available in the conversion environment. If the SVG references a web font (Google Fonts, etc.) and the tool has internet access to load it, the font will render correctly. If the font is a local system font on your machine but not available in the conversion tool's environment, it will fall back to a default font. The safest approach is to convert text to paths (outlines) in your SVG editor before converting, which removes the font dependency entirely.
What is the largest size I can export? This browser-based tool renders the SVG on an HTML Canvas. Modern browsers support canvas dimensions up to approximately 16,384x16,384px, though very large renders may be slow or fail on devices with limited RAM. For most use cases (web, print, presentations), 2000 to 4000px is more than sufficient.
Can I convert multiple SVGs at once? Yes. The batch mode allows uploading multiple SVG files and converting them all at the same output dimensions. Each file is processed individually and the results are packaged in a ZIP for download. This is useful for icon sets or generating multiple brand asset sizes in one step.
Pixel counts at the sizes you actually export
Choosing an output width is really choosing a pixel count, and the pixel count sets the memory the render needs. A PNG stores four bytes for each pixel when it carries a red, green, blue and alpha channel, before compression. The table below gives the raw figures.
| Output size | Pixels | Uncompressed RGBA bytes | Equivalent |
|---|---|---|---|
| 256 by 256 | 65,536 | 262,144 | 0.25 MiB |
| 512 by 512 | 262,144 | 1,048,576 | 1.00 MiB |
| 1024 by 1024 | 1,048,576 | 4,194,304 | 4.00 MiB |
| 2000 by 2000 | 4,000,000 | 16,000,000 | 15.26 MiB |
| 4096 by 4096 | 16,777,216 | 67,108,864 | 64.00 MiB |
| 8192 by 8192 | 67,108,864 | 268,435,456 | 256.00 MiB |
| 16384 by 16384 | 268,435,456 | 1,073,741,824 | 1024.00 MiB |
Doubling the width and height multiplies the pixel count by four and the memory by four with it. That is why a 4096 pixel render is comfortable on a laptop and an 8192 pixel render is not. The compression in the file does not change the memory the browser needs while it draws the canvas.
Print sizes converted to pixels
A printer resolves 300 dots per inch, which is 11.81102 dots per millimetre. Multiply your physical size in millimetres by that figure to get the pixel dimensions the export needs.
| Printed item | Physical size | Pixels at 300 dpi |
|---|---|---|
| A4, upright | 210 by 297 mm | 2480 by 3508 |
| A4, rotated | 297 by 210 mm | 3508 by 2480 |
| US Letter | 215.9 by 279.4 mm | 2550 by 3300 |
| Business card | 90 by 50 mm | 1063 by 591 |
| 6 by 4 inch photo | 152.4 by 101.6 mm | 1800 by 1200 |
The card row is the case used in the worked example above. Take 90 millimetres, multiply by 300 and divide by 25.4, and you get 1062.9921 pixels. Rounding up gives 1063. The same operation on 50 millimetres gives 590.5512, which rounds to 591. Both printed figures on this page are correct to the pixel.
Working the presentation header longhand
The page's first example asks for a 600 by 240 pixel export of a logo whose SVG code declares a 100 by 40 viewBox. Every figure follows from that ratio.
| Step | Working | Result |
|---|---|---|
| Scale factor | 600 divided by 100 | 6 |
| Height from the ratio | 40 times 6 | 240 |
| Pixel count | 600 times 240 | 144,000 |
| Uncompressed RGBA bytes | 144,000 times 4 | 576,000 |
A 576,000 byte buffer is small enough that the render is instant on any device. The same logo at 2000 pixels wide gives 2000 by 800, which is 1,600,000 pixels and 6,400,000 bytes before compression. Compare the two pixel counts, 40,000 for a 200 by 200 export against 4,000,000 for a 2000 by 2000 export, and the ratio is exactly 100. Each tenfold increase in linear size costs a hundredfold increase in pixels.
Sizing an icon set for a retina display
Browsers pick the file that matches the display, so an icon that occupies a 200 pixel slot needs several exports if you want it sharp on every screen.
| Display density | Export width | Export height for a square icon |
|---|---|---|
| 1x | 200 px | 200 px |
| 2x | 400 px | 400 px |
| 3x | 600 px | 600 px |
Keep the SVG as the master and generate each raster from it. Regenerating a PNG from another PNG loses the vector arithmetic permanently, because raster to vector is not a conversion this tool performs or that a raster format can support.
What the 16384 pixel ceiling means
Browsers cap canvas dimensions, and the working figure for this tool is approximately 16384 pixels on each side. A square render at that limit covers 268,435,456 pixels, which needs 1,073,741,824 bytes of RGBA memory, or exactly 1 GiB. Devices with less free memory than that will fail or swap heavily, which is why very large exports slow down or stop rather than simply taking longer.
For almost every purpose the useful range is far below the ceiling. A web image needs between 800 and 2000 pixels. A print image for A4 at 300 dots per inch needs 2480 by 3508. Presentation slides rarely need more than 1920 pixels wide. Stay under 4096 pixels on each side and you stay inside 64 MiB of buffer, which every current browser handles without difficulty.
The standards the two formats follow
PNG is specified in the W3C Recommendation "Portable Network Graphics (PNG) Specification (Second Edition)", published on 10 November 2003 and also issued as ISO/IEC 15948:2004. That edition incorporates all known errata from the original 1996 version. The compression is DEFLATE, specified in RFC 1951 by L. Peter Deutsch in May 1996, which combines LZ77 matching with Huffman coding over filtered scanlines. DEFLATE is lossless, so a PNG preserves every pixel value exactly.
SVG is a separate W3C specification that describes shapes, paths, text and fills as XML. Because the two formats describe images in fundamentally different ways, conversion runs one way only. That is the reason to keep the SVG file alongside every PNG you generate from it.
Also try these free tools: