Why does my exported PNG look blurry or pixelated?

Because PNG is a raster format — it stores pixels, not vectors — so the resolution is baked in at export time. If your SVG's intrinsic size is 24×24 (common for icons) and you export at 24×24, then display it at 96px on a page, the browser upscales 24 pixels into 96 and it looks soft. Fix it with the scale control: pick 2× or 3×, or type a larger output width directly. For a 24px icon that needs to look sharp at 48px on a Retina screen, export at 4× (96×96 pixels). The SVG re-renders cleanly at every size because we rasterize from the vector each time, not from an intermediate bitmap.

How do I keep the transparent background?

Leave the Background control on "Transparent" — that is the default. PNG supports a full 8-bit alpha channel, so the transparent regions of your SVG stay transparent in the output. The preview sits on a checkerboard so you can actually see the transparency instead of guessing. Only switch to "Solid color" when you specifically need a flat fill — for example exporting an icon for a context (older email clients, some chat apps) that renders transparency as black.

Why did my SVG come out blank or empty?

Almost always an external reference that the browser refuses to load when an SVG is used as an image source. The two usual culprits: (1) a web font referenced by name but not embedded, so the text renders with zero glyphs; (2) an or pointing at an external file or URL. Image-mode SVG rendering is sandboxed — external scripts never run and most external resources never load — which is great for safety but means anything not inlined goes missing. Fix it by embedding fonts as paths (convert text to outlines in your editor) and inlining referenced images as data URIs before pasting.

What is the largest PNG I can export?

Output is capped at 16384×16384 pixels per side, which is the ceiling most browsers put on a single canvas. In practice you will hit a memory wall on phones well before that — a 16384×16384 RGBA buffer is about 1 GB of RAM. For poster-sized exports (large-format print) a desktop tool like Inkscape or rsvg-convert is a better fit. For screens, icons, app stores, and social cards, the in-browser path here is plenty.

Is my SVG uploaded anywhere?

No. Everything runs in your browser tab: DOMParser reads the dimensions, a blob URL feeds the SVG into an off-screen Image, Canvas draws it, and canvas.toBlob produces the PNG. Open the DevTools Network panel before you convert — you will see zero requests. This means unreleased logos and client artwork never leave your machine, and the tool keeps working offline once the page is cached.

Export a Figma icon as a 3× PNG for a legacy Android build

Your design system lives in SVG, but an older Android module still consumes PNG drawables and wants xxhdpi (3×) assets. Copy the icon's SVG out of Figma's dev mode, paste it here, confirm the intrinsic size reads 24×24, set the scale to 3×, keep the background transparent, and download a crisp 72×72 PNG. Repeat for hdpi (1.5× → type 36 in width) and xhdpi (2×). No round trip through a design app's "export at scale" dialog, and the transparency survives so the icon composites over any toolbar color.

Make a transparent PNG logo for a slide deck that rejects SVG

Keynote and older PowerPoint builds either refuse SVG outright or render it with the wrong stroke widths. Paste your brand logo's SVG, leave the background transparent, bump the scale to 2× so it stays sharp when someone presents on a 4K projector, and drop the PNG straight onto the slide. Because the fill is transparent, the logo sits cleanly on a dark title slide and a white content slide without a visible box around it.

Generate an Open Graph share image from a vector template

You have a 1200×630 social card designed as SVG with the post title swapped in. Paste the finished SVG, type 1200 × 630 into the size fields (unlock aspect if your template is already that ratio), pick a solid background so link-preview crawlers that flatten alpha don't show black, and export. Drop the PNG into your meta tags as the og:image. The whole thing runs locally, so you can batch a dozen variants without burning an API quota.

Rasterize an SVG sprite frame for an email signature

Email clients are notoriously hostile to SVG — Gmail, Outlook, and Apple Mail all strip or refuse it. Take the one frame of your icon set you need, paste its standalone SVG, set a fixed width like 120px (height auto-locks), keep transparency, and export. The resulting PNG drops into the signature HTML as a plain that renders identically across every mail client, which SVG never will.

Turn a hand-tuned chart SVG into a PNG for a PDF report

You built a chart in D3 or a plotting library that outputs SVG, but your reporting pipeline assembles a PDF from raster images. Paste the chart's SVG, set the output width to match your report column (say 1600px for a full-bleed figure at print DPI), use a white background so the chart reads on the page, and export. The axis text and thin gridlines stay sharp because they are rasterized from the vector at the final size, not scaled up from a screen-resolution screenshot.

SVG to PNG Converter — custom size, HiDPI scale, transparent background, 100% in your browser

Rasterize SVG to PNG in your browser — custom size, 1×/2×/3× HiDPI scale, true transparent background, never uploaded.

Runs locally
Category Image
Best for Getting images to the right size, format, or weight before publishing.

🖼️

Drop a .svg file here, or browse

Single SVG file — never uploaded

Or paste SVG source

Output width (px)

Output height (px)

Lock aspect ratio

Scale (for crisp HiDPI export)

Background

100% local. Your SVG never leaves your browser.

What this tool does

Turn any SVG into a PNG without uploading a byte. Paste the SVG source, drop a .svg file, or browse to one. The tool reads the intrinsic size from the width/height attributes (or the viewBox when those are missing), shows it to you, then rasterizes through an off-screen Canvas and hands back a downloadable PNG. Set the exact output width and height, lock the aspect ratio, and pick a 1×/2×/3× (or custom) scale so the PNG stays crisp on Retina and 4K screens. Background is transparent by default — that is PNG's whole reason to exist over JPG — or drop in any solid hex when you need a flat fill. The SVG is loaded as an image via a blob URL, not injected into the page, so a pasted file carrying a <script> or onload handler cannot run anything in your browser.

Tool details

Input: Files + Text + Numbers; The page exposes text boxes, numeric controls, file pickers, or structured inputs depending on the tool.
Output: Live result + Download + Preview; The result area focuses on usable output, with copy, download, or preview actions when supported.
Privacy: Browser-side processing; The main tool logic does not call an external API, so inputs normally stay in the current tab.
Save / share: Shareable URL state; Key settings are encoded in the URL so another person can reopen the same setup.
Performance budget: Initial JS <= 12 KB; No WASM budget is declared, keeping the tool quick to open on mobile.
Best fit: Image · Designer; Category and role tags drive related tools, internal links, and quick fit checks.

How to use

1. Input

Paste or drop your content into the tool panel.
2. Process

Click the button. All processing is local in your browser.
3. Copy / Download

Copy the result or download to disk in one click.

How SVG to PNG Converter fits into your work

Use it while preparing images for websites, stores, social posts, forms, or handoff packages.

Image jobs

Getting images to the right size, format, or weight before publishing.
Checking privacy-sensitive EXIF and metadata before sharing a photo.
Creating publish-ready variants without uploading private assets.

Image checks

Resize to the real display size before compressing.
Review transparency, animation, and color profile changes after conversion.
Strip or review metadata when the image contains private context.

Good next steps

These links move the current task into a more complete workflow.

Real-world use cases

Export a Figma icon as a 3× PNG for a legacy Android build
Your design system lives in SVG, but an older Android module still consumes PNG drawables and wants xxhdpi (3×) assets. Copy the icon's SVG out of Figma's dev mode, paste it here, confirm the intrinsic size reads 24×24, set the scale to 3×, keep the background transparent, and download a crisp 72×72 PNG. Repeat for hdpi (1.5× → type 36 in width) and xhdpi (2×). No round trip through a design app's "export at scale" dialog, and the transparency survives so the icon composites over any toolbar color.
Make a transparent PNG logo for a slide deck that rejects SVG
Keynote and older PowerPoint builds either refuse SVG outright or render it with the wrong stroke widths. Paste your brand logo's SVG, leave the background transparent, bump the scale to 2× so it stays sharp when someone presents on a 4K projector, and drop the PNG straight onto the slide. Because the fill is transparent, the logo sits cleanly on a dark title slide and a white content slide without a visible box around it.
Generate an Open Graph share image from a vector template
You have a 1200×630 social card designed as SVG with the post title swapped in. Paste the finished SVG, type 1200 × 630 into the size fields (unlock aspect if your template is already that ratio), pick a solid background so link-preview crawlers that flatten alpha don't show black, and export. Drop the PNG into your meta tags as the og:image. The whole thing runs locally, so you can batch a dozen variants without burning an API quota.
Rasterize an SVG sprite frame for an email signature
Email clients are notoriously hostile to SVG — Gmail, Outlook, and Apple Mail all strip or refuse it. Take the one frame of your icon set you need, paste its standalone SVG, set a fixed width like 120px (height auto-locks), keep transparency, and export. The resulting PNG drops into the signature HTML as a plain <img> that renders identically across every mail client, which SVG never will.
Turn a hand-tuned chart SVG into a PNG for a PDF report
You built a chart in D3 or a plotting library that outputs SVG, but your reporting pipeline assembles a PDF from raster images. Paste the chart's SVG, set the output width to match your report column (say 1600px for a full-bleed figure at print DPI), use a white background so the chart reads on the page, and export. The axis text and thin gridlines stay sharp because they are rasterized from the vector at the final size, not scaled up from a screen-resolution screenshot.

Common pitfalls

Pasting an inner SVG fragment without the root <svg> element. The tool needs a complete <svg>…</svg> with a viewBox or width/height to know how big to render. A bare <path> or <g> won't parse — wrap it in an <svg> with the right viewBox first.
Expecting embedded text to use a system or web font. When an SVG is rasterized as an image, web fonts referenced by name do not load. The text either falls back to a default font or vanishes. Convert text to outlines (paths) in your editor before exporting if exact glyphs matter.
Exporting at the SVG's tiny intrinsic size (e.g. 16×16) and then scaling the PNG up in CSS. That throws away the whole point of starting from a vector. Set the output width to the size you'll actually display at, or use the 2×/3× scale — re-rasterize from the vector instead of upscaling a small bitmap.

Privacy

The conversion runs entirely in your browser tab. DOMParser reads the SVG's dimensions as read-only XML (the markup is never injected into the live page, so a pasted <script> or onload attribute cannot execute here), a blob URL feeds the SVG into an off-screen Image element, Canvas rasterizes it, and canvas.toBlob produces the PNG. No upload, no analytics on what you converted, no logging. Open the DevTools Network panel during a conversion and the request count stays at zero. The one caveat about the image-mode rendering path: external references (remote fonts, external <image> hrefs) are blocked by design — safe, but it means a non-self-contained SVG can render with missing pieces, which is a correctness note rather than a privacy one.

FAQ

Tool combos

Folks in your role tend to reach for these alongside this tool.

Browse all tools for this role

SVG to PNG Converter — custom size, HiDPI scale, transparent background, 100% in your browser

What this tool does

Tool details

How to use

1. Input

2. Process

3. Copy / Download

How SVG to PNG Converter fits into your work

Image jobs

Image checks

Good next steps

Real-world use cases

Export a Figma icon as a 3× PNG for a legacy Android build

Make a transparent PNG logo for a slide deck that rejects SVG

Generate an Open Graph share image from a vector template

Rasterize an SVG sprite frame for an email signature

Turn a hand-tuned chart SVG into a PNG for a PDF report

Common pitfalls

Privacy

FAQ

SVG Optimizer

Image Format Converter

Image Resizer

Favicon Generator

Placeholder Image Generator

Image Compressor (Local)

SVG Asset Auditor

Aspect Ratio Calculator

Avatar Generator

Base64 Image Converter

Code Screenshot Generator

CSS Shadow Generator Pro