By Claire Yoon8 min read

How to Keep a Transparent Background When Converting to SVG

An SVG has no background by default, so a white box means something added one. Here's how to keep transparency when you convert a PNG to SVG, and what to check.

On this page

Here's the detail that makes this so confusing: an SVG has no background at all by default. It's transparent unless something puts a solid shape behind your artwork. So when your converted SVG turns up with a white box around it, the question worth asking is: what added the white? It's usually one of three things: a background shape sitting in your design, an export setting that fills the canvas, or a converter that traced the empty area as a white block instead of leaving it alone. The fix depends on which one you've got, and on whether your original file even had real transparency to begin with. Let's sort that out.

The quick version
  • An SVG is transparent by default. A white background means something added one.
  • Converting a transparent PNG? Use a converter that respects the alpha channel, so it traces your subject and leaves the rest empty. Convert a PNG to SVG and check the result.
  • Starting from a JPG? It can't be transparent, so there's nothing to keep. Remove the background first, then convert.
  • Exporting from Illustrator or Inkscape? Delete the white background rectangle on your canvas and check your export settings.
  • Always verify: drop the SVG onto a colored background. If you still see white, something's there.

First, what's actually adding the white?

Before you fix anything, work out where the white is coming from. It's one of three situations, and the fix is different for each.

Your situationWhy it's whiteThe fix
Converting a transparent PNG to SVGThe converter filled the empty area, or traced it as a shapeUse a converter that respects transparency; delete any stray background shape it added
Converting a JPG, or a PNG with a solid white backgroundThere was never any transparency to keepRemove the background first, then convert
Exporting an SVG you designed in Illustrator or InkscapeA background rectangle on your canvas, or an export setting adding a fillDelete the background shape; check the transparent option on export
Where the white comes from
Diagram showing three sources of a white background in an SVG: a background rectangle shape, an export setting adding a fill, and a converter tracing the empty area as a white block
An SVG starts transparent. White creeps in from a background shape, an export setting, or a careless trace.

The middle row trips up the most people, so start there.

If your file isn't really transparent, no converter can fix that

This is the part the forums skip. A JPG cannot store transparency, ever. If your logo is a JPG, it has a solid background baked into the pixels, even when that background is white and looks like "nothing." Converting it to SVG won't strip that away. The trace will either include the background as a shape or sit right on top of it. (Converting a JPG is a slightly different job in general, which how to convert a JPG to SVG covers.)

Some PNGs have the same problem. A PNG can store transparency, an alpha channel, but plenty of them were saved with a plain white fill instead. If you're not sure which you have, open the file over a dark background. See a white rectangle around your logo? It isn't transparent. It only looked that way against a white page.

The fix in both cases is the same: remove the background before you convert, so the converter has real transparency to work with. Cut the subject out in any photo editor, export a transparent PNG, then trace that. (PNG vs SVG explains why a PNG can hold transparency and a JPG can't.)

Converting a real transparent PNG to SVG

If your source is a genuinely transparent PNG, keeping that transparency through the conversion mostly comes down to the converter you use. The job is simple in principle: trace the visible subject into vector paths and leave the transparent area as empty space, not a white shape. A good converter does exactly that. A careless one does one of two irritating things instead:

  • It fills the transparent area with white, so you get a solid box.
  • It traces the edge of the transparent area as its own path, so you end up with an invisible-but-real rectangle around your design that appears the moment you drop it on a colored background or send it to a cutting machine. Makers run into this constantly. It's the same stray box around a Cricut design.

So the move is to convert with a tool that handles the alpha channel cleanly, then verify it (more on that below). A transparent logo is the most common version of this.

What this looks like with PerfectVector

PerfectVector reads your PNG's transparency and traces only what's actually there. The visible part of your logo becomes clean, editable vector paths, and the transparent area stays transparent: no white box, no hidden bounding rectangle. The result drops onto any colored background, a website, a sticker sheet, a Cricut mat, and the color behind it simply shows through. You can convert your transparent PNG and check it against a colored backdrop in a few seconds. The first conversions are free, no credit card required.

To be straight with you, though: PerfectVector keeps the transparency that's already in your file. It can't invent transparency that was never there. If your source is a JPG or a white-filled PNG, cut the background out first, as above, and then the conversion stays clean.

White box
A logo converted to SVG with an unwanted white box behind it, shown on a teal background
A careless trace left a white rectangle, obvious the moment it's on a color.
Transparent
The same logo converted to SVG with the background kept transparent, the teal showing through cleanly
Transparency kept: the colored background shows straight through.

How to check it actually worked

Don't trust the thumbnail. A transparent SVG looks identical to a white-background one against a white page, which is exactly why people think they're fine until they aren't. Two quick checks:

  • Drop it on a color. Place the SVG over a colored background in your browser, Figma, Canva, or Design Space. Real transparency lets the color through. A white box won't.
  • Look for a stray rectangle. Open the SVG and select the shapes. If there's a full-size rectangle sitting behind your artwork, delete it. That's the culprit in most "it's still white" cases.

Exporting an SVG you designed (the other situation)

If you're not converting a raster but exporting an SVG you drew yourself, the white usually comes from your own canvas, not a converter:

  • Illustrator: delete any white rectangle acting as a background. The artboard color doesn't export anyway, so once the background shape is gone, save or export as SVG and it'll be transparent.
  • Inkscape: make sure no background rectangle is selected, hide or delete the original raster if you traced one, and export the vector. Inkscape SVGs are transparent unless you added a fill.

Either way, the rule from the top still holds: an SVG has no background unless you gave it one.

FAQ

Does an SVG support a transparent background? Yes, and it's transparent by default. An SVG has no background unless a shape or fill is added, so transparency is the starting state, not something you have to switch on. White appears only when something puts it there.

How do I save an SVG with a transparent background? Make sure there's no background rectangle in your design, then export without a background fill (most tools export transparent by default). Afterward, verify by placing the SVG on a colored background. If you see white, find and delete the background shape.

Why does my SVG have a white background after converting? Either the converter added a white fill or traced the empty area as a shape, or your original file wasn't actually transparent. Check the source first: if it's a JPG or a white-filled PNG, there was no transparency to keep, and you'll need to remove the background before converting.

Can I convert a JPG to SVG with a transparent background? Not directly, because a JPG can't store transparency. Its background is baked into the pixels. Remove the background first (cut out the subject and export a transparent PNG), then convert that to SVG.

How do I keep transparency when converting a PNG to SVG? Start from a genuinely transparent PNG and use a converter that respects the alpha channel, so it traces your subject and leaves the rest empty. Then confirm the result on a colored background and delete any stray rectangle the trace may have added.

How do I remove a white background from an SVG? Open the SVG, select the shapes, and delete the full-size white rectangle behind your artwork. If the white is part of an embedded raster rather than a shape, re-convert from a truly transparent source instead.


Got a transparent logo stuck as a PNG? Turn it into a clean SVG that keeps its transparency, then drop it on a colored background to confirm it came through.

More from the blog

Ready to create
perfect vectors?