SVGKit
← Browse all toolsSVG to PNG

SVG to PNG

Convert

Render SVG in the browser and download a PNG file.

Loading...

Page context

Where SVG to PNG fits

SVG to PNG generates a browser canvas export plan for PNG output.

PNG export plan

The tool parses SVG dimensions and outputs the canvas steps needed to rasterize the SVG as image/png in the browser.

Choosing export dimensions

Raster size comes from the SVG width and height or viewBox. Export at 2x for retina screens and 512px or 1024px masters when the asset will be resized again downstream.

A translation between formats Source PNG · JPG · WEBP PDF · SVG · EPS parsed locally rules of the target Target standards-based output, previewed before export no server round-trip Formats differ in what they can represent — differences concentrate in gradients, filters, and interactivity.
Conversion is a translation between formats: SVG to PNG preserves what the target format can represent and previews it before export.
A source document translated into a target document through format rules, illustrating how SVG to PNG converts locally without a server round-trip.

Transparency and backgrounds

PNG keeps alpha, so a transparent SVG background stays transparent. Compositing over white or another brand color is a one-line fill before the draw step if you need an opaque asset.

Use cases

Use it to prepare a browser-side PNG export workflow for icons, diagrams, illustrations, and docs assets.

How the conversion works

SVG to PNG parses the input in your browser, applies the target format's rules, and produces standards-based output without a server round-trip. The page shows the result before you commit to it.

What to expect from the output

Formats have different capabilities, so conversion is a translation rather than a perfect copy. Check dimensions, colors, and any interactive features in the preview, since those are the areas where formats differ most.

How to use

  1. Paste SVG. Paste SVG markup with dimensions or viewBox.
  2. Generate plan. The tool reports target format, filename, and canvas steps.
  3. Pick dimensions. Export at the display size, or 2x for retina screens.
  4. Use in browser. Use the plan to implement canvas raster export.

Frequently asked questions

Does it download a PNG now?
No. The first version outputs a canvas export plan and metadata.
Why not generate binary output in tests?
Node tests do not provide a browser canvas. The page can add interactive canvas export later.
Does it preserve transparency?
The PNG plan keeps transparency unless the SVG itself has a background.
What size should I export?
Match the rendered size, or 2x it for high-density screens; icons usually export well at 512px.
Why does my PNG look blurry?
The raster size was smaller than the display size. Re-export with larger dimensions rather than scaling the PNG up.
Does it upload my SVG?
No. Parsing runs locally in your browser.
Is SVG to PNG free?
Yes. SVGKit tools are free to use with no account required.
Does SVG to PNG upload my files?
No. The tool runs entirely in your browser, so your files never leave your device.