How to Convert SVG to PNG

SVG stores shapes as XML — infinite zoom, small files for icons. PNG is pixels — what PowerPoint, older CMS editors, and many email clients expect. Converting means choosing output width, handling transparency, and accepting that vectors become fixed resolution. Email clients and older PowerPoint builds on corporate laptops often block external SVG for security; PNG is the portable fallback for slide decks and newsletters.

Inkscape (desktop, free)

Open the SVG, set document size or export width in pixels, File → Export PNG Image. Enable antialiasing for smooth curves. For @2x assets, double the pixel width you need on screen.

Browser quick export

Drag SVG into Chrome or Firefox, screenshot at zoom 100% — crude but fast for internal slides. Better: use dev tools or an export dialog when available. Batch renaming exported PNGs with `@2x` suffix helps developers drop assets into iOS and web repos without ambiguous `logo.png` duplicates.

macOS Preview and design apps

Preview opens many SVGs; Export PNG sets resolution. Figma and Sketch import SVG and export PNG at 1x/2x/3x in one step — ideal for design systems.

FileToolsHub converter

Upload .svg to /tool/svg-to-png, set output width (height scales proportionally unless the tool offers both), download PNG. Useful on a locked-down machine without Inkscape. Need favicons? After PNG, try /tool/ico-generator for multi-size icons.

Transparency and backgrounds

SVG with transparent background should yield PNG with alpha. Flattened white happens if the exporter adds a canvas color — set background transparent in export settings.

When not to convert

If the platform accepts SVG (modern web, some Android assets), keep vector. Email and legacy Word often require PNG or JPG.

Before you send PNGs to partners

Zoom to 100% and actual display size — icons meant for 24 px UI should be exported near that width, not 4000 px unless the target is print. Confirm transparency on both light and dark backgrounds if the asset sits on variable themes. When brand guidelines supply SVG masters, store them as source and generate PNG derivatives per platform requirements instead of letting each team rasterize ad hoc with inconsistent padding.

Subpixel alignment matters for 16px toolbar icons — design on pixel grid, export at exact multiples. For slides, export 1920-wide background PNG once rather than scaling SVG live if the venue laptop has old PowerPoint. CMYK print workflows may need a separate print PDF pipeline; PNG from SVG is RGB screen space. When logos use gradients, rasterize at higher width before shrinking down to reduce banding. Keep SVG source under version control; PNG exports are build artifacts you can regenerate. Test on both Retina and non-Retina displays if the PNG sits in a desktop app chrome.

Vector logos with hairline strokes need a wider export width than icons with bold shapes — when in doubt export at 1024 px wide and let CSS downscale. For Microsoft Office, Insert Picture from PNG avoids SVG filter bugs in older builds. Game and app asset pipelines often require power-of-two PNG dimensions; round up in /tool/svg-to-png settings when the tool allows custom width. If colors look washed out, check whether the SVG referenced display-p3 and re-export from sRGB masters. For favicons, generate multiple PNG sizes from one SVG master so tab icons stay sharp. When slides import PNG, avoid upscaling small exports — re-rasterize from SVG at slide width. Test transparent PNG on both white and dark slide masters before a client presentation. Sprite sheets and icon fonts are legacy patterns; PNG sprites from SVG still appear in game tooling — export uniform tile sizes to simplify CSS. When uploading PNG to a CMS that recompresses, upload the least compressed master you have to avoid double JPEG artifacts if the CMS converts again. Re-export once if the first PNG looks soft at 100% zoom.

FAQ

Why is my PNG blurry? Export at higher pixel width; small SVG viewBox blown up without enough pixels looks soft.

Will text stay editable? No — convert text to outlines in the SVG first if font substitution is a risk.

Color profile? sRGB is safest for web PNG; print workflows may need CMYK elsewhere.

Are uploads kept? Conversion is job-based; download promptly for sensitive logos.