PNG to SVG Converter

What does PNG to SVG conversion do?

This tool wraps a raster image (PNG, JPG, or WebP) inside a valid SVG file using the SVG <image> element. The image bytes are Base64-encoded and embedded directly as a data URL, so the resulting .svg file is entirely self-contained — no external image references, no separate files to keep in sync. You get one file you can hand to Figma, drop into an HTML page, or commit to source control alongside other SVG assets.

SVG wrapper vs. true vectorization — what's the difference?

It's important to understand what this conversion does and does not do. SVG wrapping preserves every pixel of the original raster image inside an SVG container. The image itself is still pixel-based; if you scale the SVG up beyond the original resolution, the embedded photo or logo will appear blurry, just as it would in an <img> tag.

True vectorization (also called tracing or auto-tracing) analyzes the pixel data and converts shapes, edges, and color regions into mathematical Bezier curves stored as SVG <path> elements. A vectorized image scales to any size without loss of quality. This tool does not perform tracing — for that, use Inkscape's free "Trace Bitmap" (Path menu) or Adobe Illustrator's Image Trace feature.

Most workflows that need "a PNG as an SVG" actually need the wrapper, not a trace — for example, placing a company photo into a slide deck template that only accepts SVG, or using a screenshot as a layer in an SVG animation.

When to use an SVG wrapper

• Design tools — Figma, Sketch, and Affinity Designer accept SVG files. Wrapping a PNG lets you import it as a reusable SVG component even when the tool restricts direct raster imports.
• SVG illustrations and animations — embed a photograph or texture as a layer inside a hand-crafted SVG without breaking the single-file requirement.
• Email templates — some SVG-based email builders expect all assets as SVG; a wrapped PNG slots in without redesigning the template.
• Icon sprites — legacy SVG sprite workflows that expect every asset to be an SVG file can accommodate raster images through wrapping.
• Print and publishing — certain print pipelines (InDesign, Scribus) prefer SVG over loose rasters for linked assets.

File size and the Base64 overhead

Base64 encoding increases the binary image size by approximately 33% because every 3 bytes of binary data become 4 ASCII characters. A 500 KB PNG therefore produces a roughly 667 KB SVG. For large photos this overhead is significant — keep the original raster when file size matters and only convert when an SVG format is specifically required downstream.

JPEG images already use lossy compression, so wrapping a JPEG inside SVG gives you the JPEG's small file size plus ~33% Base64 overhead. PNG files with transparency are losslessly encoded, so the overhead is proportionally the same but the absolute size depends on the original PNG compression level.

Transparency and format notes

PNG and WebP support alpha-channel transparency, which is preserved in the SVG wrapper — the transparent regions remain transparent in the final SVG. JPEG does not support transparency; the background is baked in as white (or whatever background color the JPEG was saved with). If you need a transparent logo in SVG format, start from a PNG source with transparency, not a JPEG.

Privacy — what actually happens to your file

This site runs on Blazor Server, so file uploads work differently than the name "upload" might suggest. When you select a file, the bytes are streamed over your own live connection to the server — that's how Blazor Server's file input works for any uploaded file, not a deliberate choice for this tool specifically. The server reads the bytes (HandleFileUpload in this page's own code does the Base64 encoding in C#, not JavaScript), then sends the result back for the browser to render. Nothing is written to disk or logged — it's processed in memory for that one request only, consistent with this site's privacy policy — but "never uploaded to any server" isn't accurate for how this works.