Why an SVG Has No Size Until You Convert It
People often ask how to convert SVG to PNG "without losing quality", and the question contains a misunderstanding worth clearing up first. An SVG does not have a quality to lose. It has no pixels at all.
Vectors Describe, Pixels Store
An SVG is a description of shapes — curves, fills, text — in a coordinate system with no fixed pixel size. A PNG is a fixed grid of pixels. Converting SVG to PNG therefore always means choosing a size, and the result is sharp at any size you choose.
Open an SVG in a text editor — the file you are about to convert SVG to PNG from — and you will find instructions: move to this point, curve to that one, fill with this colour. Nothing says how many pixels wide the drawing is. The browser decides that at display time, and it can decide differently every time.
What viewBox, width and height Actually Mean
Three attributes on the root element control size. The viewBox defines the coordinate system — "this drawing spans 0 to 240 across and 0 to 160 down". The width and height, if present, suggest a default display size. Many SVGs have only a viewBox, some have only width and height, and a few have neither.
This converter reads whichever are present, works out an intrinsic size the way a browser would, and uses it as the 1× base. If none are declared, it falls back to 1,024 pixels so you still get a usable image.
Why "Without Losing Quality" Is the Wrong Question
Because the SVG can be rendered at any size from the same instructions, a 4,000-pixel PNG is exactly as sharp as a 400-pixel one — the renderer simply draws more detail. The only way to lose quality is to render small and then enlarge the PNG afterwards. The fix is to pick the final size here, at conversion time, and never scale the PNG up.
What This SVG to PNG Converter Does
This tool reads your SVG files in the browser, removes anything executable, renders each one at the size you choose with the browser's own engine, and hands back lossless PNGs with transparency intact — individually or as a ZIP.
The Same Renderer as Your Browser
Server-side converters use a separate library — librsvg, Inkscape, ImageMagick — and each has gaps: a filter it does not support, a font it substitutes, a gradient it draws slightly differently. The PNG you get back may not match the SVG you looked at.
Here the rendering is done by Blink, Gecko or WebKit — whichever browser you are using — drawing the SVG onto a canvas. If the SVG looks right in your browser, the PNG will look the same, because it is literally the same drawing.
Scripts Stripped, Nothing Uploaded
SVG is XML, and it can contain <script> elements, onload handlers and embedded HTML. A file from an unknown source is not something to open casually. Before rendering, the converter removes scripts, event attributes and foreignObject blocks, and renders the result inside an image element that cannot run code anyway. Two layers, both local.
Nothing is uploaded at any point. The Network panel in your browser's developer tools stays empty while a batch converts.
How to Convert SVG to PNG in 3 Steps
Drop your SVG files
Drag one or more .svg files onto the dashed area, or click to browse. Up to 10 at a time on desktop. Each row shows a live preview of the vector — browsers display SVG natively, so what you see is what will be rendered.
Choose a size and background
In Conversion Settings, pick Scale (1×, 2×, 3× or 4× of the SVG's own size) or Width (a preset or any pixel width; height follows the aspect ratio). Then choose a background: transparent by default, or white, black or any colour to flatten onto.
Download PNGs or a ZIP
Press Convert. Each file shows its output dimensions and PNG size. Download them one by one, or press Download All for a ZIP with the original names and a .png extension.
Drop up to 10 SVG files. They are read locally and never uploaded.
Pick a scale or type a width, then choose a transparent or solid background.
Download each PNG on its own, or everything as a ZIP.
Picking the Right Output Size
Because size is a choice, it helps to know what the choices are for. Two modes cover almost every SVG to PNG job.
1×, 2×, 3× — Matching Screen Density
A standard monitor shows one pixel per CSS point. A Retina or HiDPI display shows two; most modern phones show three. An icon that is 32 points on screen therefore needs a 32-pixel PNG for the first, 64 for the second and 96 for the third. That is the entire meaning of 1×, 2× and 3×.
Web and app work usually exports the same SVG at all three scales. Drop the file once, convert at 1×, change the setting, convert again — or simply export at 3× and let the platform downscale.
A Sizing Table for Common Targets
Favicons: 16, 32 and 48 pixels, best made with the PNG to ICO tool from a 512-pixel PNG. App icons: 1024 pixels for stores, then the icon set generator. Social avatars: 400 to 800 pixels. Open Graph images: 1200 × 630. Marketplace listings: typically 2000 pixels on the long edge.
Custom Width for Print and Marketplaces
For print, work back from the physical size at 300 DPI: an A4 page is 2,480 pixels wide, an A3 is 3,508, a 6-inch sticker is 1,800. Switch to Width mode, type the number, and the height follows the SVG's aspect ratio. The converter caps output at 16,384 pixels on the longer edge — the limit browsers impose on a canvas — and tells you if a request had to be reduced.
Transparency, Backgrounds and Edges
Most SVGs — logos, icons, illustrations — have no background: the shapes float on nothing. PNG can store that, which is one of the two reasons to prefer it over JPG for this job.
Keeping the Background Transparent
Transparent is the default when you convert SVG to PNG here. Every pixel the SVG did not paint stays clear, including the partially-covered pixels along curved and diagonal edges. Those soft edge pixels are what let the PNG sit on a dark slide, a coloured button or a photograph without a visible outline.
Results show over a checkerboard so you can confirm the transparency before downloading.
When to Flatten to a Colour
Some destinations cannot handle alpha — older email clients, certain print workflows, a few marketplace uploaders that convert to JPG behind the scenes. For those, pick White, Black or a custom colour in the background setting. The shape is composited onto that colour and the PNG is fully opaque.
Choose the colour that matches where the image will sit. Flatten onto white and then place the PNG on a dark background, and the edge pixels — now pale orange, pale blue, whatever the shape colour was — appear as a faint halo. That halo is the single most common complaint about converted logos, and it is a background choice, not a rendering fault.
What Can Go Wrong (and How to Fix It)
Rendering SVG to PNG in the browser means the PNG matches the screen, but it also inherits the browser's rules about what an image is allowed to load.
Missing Fonts
Text in an SVG is rendered with whatever font it names. If that font is not installed on your machine and not embedded in the file, the browser substitutes one, and the PNG shows the substitute. Web fonts referenced by URL will not load either: an SVG rendered as an image is not allowed to fetch external resources.
The reliable fix is to convert the text to outlines in your design tool before exporting the SVG. The letters become paths and render identically everywhere.
Missing Linked Images
The same rule applies to <image href="https://…">. A raster image pulled in from a URL will come out blank. Embed it instead — most editors have an "embed images" export option, which turns the link into a data URI inside the SVG. Embedded images render fine.
Blank or Tiny Output
An SVG with neither a viewBox nor width and height renders at a fallback size here; if the drawing sits far from the origin it can land outside the visible area. Add a viewBox that encloses the artwork. A tiny output almost always means the SVG declares a small width and height — switch to Width mode and type the size you actually want.
Symptom, Cause, Fix
| Symptom | Likely cause | Fix |
|---|---|---|
| Wrong font in the PNG | Font not installed / web font blocked | Convert text to outlines before export |
| Photo inside the SVG is blank | Linked by URL, not embedded | Re-export with images embedded |
| PNG is tiny | SVG declares a small width/height | Use Width mode and type the target |
| Artwork cut off | viewBox does not enclose the drawing | Fix the viewBox in the editor |
| Halo on dark backgrounds | Flattened onto white | Keep transparent, or flatten onto the real background colour |
| Filter or blur looks different | Server converter used a different engine | Convert here — the browser renders it |
What People Make With SVG as PNG
If SVG scales perfectly, why convert SVG to PNG at all? Because a great deal of software still cannot take a vector.
Icon Sets and Favicons
App stores, favicon formats and many icon systems want fixed-size PNGs. Convert once at the largest size you need, then cut the rest with the icon generator or PNG to ICO.
Platforms That Reject SVG
Social networks, marketplaces, community forums and most CMS media libraries refuse SVG uploads — partly for security, since SVG can carry scripts. A 2× PNG with a transparent background is the universal substitute.
Email Signatures and Newsletters
Mail clients strip SVG or show a broken image. Logos in email are PNGs, ideally exported at 2× and displayed at half size so they stay crisp on Retina screens.
Print and Large Format
Print shops accept PDF and high-resolution raster. Use Width mode to render a logo at 3,000 or 4,000 pixels and it will print cleanly at poster size — vectors rasterised at the target size have no upscaling blur.
Browser-Based vs Server-Based SVG Converters
Almost every SVG to PNG converter online uploads the file and renders it on a server with librsvg, Inkscape or a headless browser. It works for simple shapes and drifts on anything complicated.
Fidelity
Each rendering library supports a slightly different slice of the SVG specification. Filters, masks, blend modes, CSS inside the file and text on a path are the usual casualties. The browser engines are the most complete SVG renderers that exist, and rendering with the one on your machine means the PNG cannot disagree with the preview.
Privacy and Limits
An unreleased logo, a product diagram, a chart with internal numbers: uploading them to a converter is a small leak nobody intends. Server tools also cap file size and daily use because rendering costs them money. Rendering on your own device removes both — there is nothing to leak and nothing to meter.
What a server does better: very old hardware will render a batch of complex SVGs more slowly than a data centre. For ten logos it makes no difference.
What to Do With the PNGs Next
The output is standard PNG, so every tool here takes it without another upload.
For the web, run it through Compress PNG or convert to WebP — both keep transparency and cut the size. For email or photos, PNG to JPG flattens and shrinks. For exact dimensions after the fact, Resize Image. And if you started with a raster and wish you had a vector, PNG to SVG goes the other way.