Guides

Transparency: what survives a conversion and what doesn't

Why your logo came back with a white box, and how to avoid it next time.

You export a logo with a transparent background, convert it to JPG for an upload form, and it comes back sitting in a white rectangle. Or the logo was white, designed for a dark header, and now it is white on white and appears to have vanished entirely.

Nothing is broken. The format you converted to has no way to record “nothing here”, so something had to be put there instead.

What transparency actually is

A normal image pixel stores three numbers: red, green and blue. An image with transparency stores a fourth, called alpha, which records how opaque that pixel is.

Alpha is more than a yes-or-no flag. In an 8-bit alpha channel it runs from 0 to 255: 0 is fully transparent, 255 is fully opaque, and everything between is partial. That in-between range makes transparency look smooth and not jagged, in the soft edge of a drop shadow, the anti-aliased curve of a letter, or the feathered edge of a cut-out. A logo’s smooth outline is a band of pixels at intermediate alpha values, blending the shape into whatever is behind it.

This matters for conversion because formats differ in whether they support transparency and also in how precisely they can record it.

Which formats support what

FormatTransparencyNotes
PNGFull 8-bit alpha256 levels; the reliable choice
WebPFull 8-bit alphaIn both lossy and lossless modes
AVIFFull 8-bit alphaAlso handles HDR and wide gamut
SVGInherentVector; empty space is genuinely empty
GIF1-bit onlyA pixel is fully on or fully off, with no partial
JPGNoneNo alpha channel exists in the format
BMPEffectively noneAn alpha variant exists; support is unreliable

Three groups give three different conversion outcomes.

Converting to a format with no alpha

When your destination is JPG or BMP, the transparent areas cannot be preserved. The encoder needs a colour for every pixel, so the image is flattened: it is composited onto a background colour first, and that composite is what gets saved.

That background is almost universally white, which is the convention this site follows too. The consequences are predictable:

  • A dark logo on transparency becomes a dark logo on a white rectangle. Usually fine.
  • A white or light logo on transparency becomes white on white, effectively invisible. This failure surprises people, so check for it before you send the file anywhere.
  • Soft edges and drop shadows blend into white. On a white page they look correct, and on any other background they show as a pale halo around the shape.

The flattening is permanent. No operation recovers the alpha channel from the flattened result, because the information about which pixels were background and which were genuinely white is gone. Keep the original PNG.

If you need a JPG of a transparent image, the right move is usually to composite it deliberately in an editor onto the background colour it will actually sit on, then convert. That way the soft edges blend into the correct colour and not into white.

Converting to GIF: the 1-bit problem

GIF supports transparency, but only as an on/off flag. One entry in its 256-colour palette can be designated transparent, and a pixel either uses that entry or it does not. There are no intermediate values.

That is fine for a hard-edged shape. It is bad for anything anti-aliased, which is nearly everything modern. The soft edge that PNG stored as a gradient of alpha values has to be resolved into fully transparent or fully opaque, pixel by pixel. The result is the jagged, stair-stepped outline familiar from 1990s web graphics and, if the anti-aliasing was blended toward white while the GIF sits on a dark page, a visible pale fringe around the shape.

On this site, GIF output flattens onto white and makes no attempt at a 1-bit transparency approximation, because a clean white background is more predictable and more often useful than a ragged cut-out. If you need genuine hard-edged GIF transparency, that is a job for a dedicated editor where you can control the matte colour.

Converting between formats that both support alpha

PNG → WebP, WebP → PNG, AVIF → PNG and so on all preserve transparency completely. The alpha channel is decoded and re-encoded along with the colour channels, and soft edges survive exactly.

Two small caveats:

  • Lossy WebP with alpha compresses the colour channels lossily but keeps the alpha channel itself lossless. Edges stay clean, and only the colour underneath is compressed.
  • Very wide colour gamuts in AVIF may be rendered into standard RGB during a browser-based conversion. Alpha is unaffected, and this only matters in specialised print or HDR workflows.

SVG is a special case

SVG has no background at all. It describes shapes on an infinite transparent canvas, so transparency is its default state and is no added feature.

Rasterising an SVG to PNG therefore preserves everything: the empty canvas becomes transparent pixels, and soft edges become intermediate alpha. Rasterising to JPG flattens the entire canvas onto white, which for a light-coloured logo is the disappearing act described above.

There is a separate SVG trap worth knowing: fonts. If your SVG references a typeface by name and does not embed it as paths, the renderer substitutes whatever it has, and your careful type turns into something else. Convert text to outlines in your editor before exporting the SVG if the result needs to be faithful. This has nothing to do with transparency, but it is the other reason a rasterised SVG comes back looking wrong.

A checklist before you convert

  1. Does the source have transparency? Open it against a dark background. If the shape is floating, it does.
  2. Does the destination support alpha? PNG, WebP and AVIF yes; JPG and BMP no; GIF only as on/off.
  3. If the answer is no, what colour will it be flattened onto? White, by default. Ask whether the artwork survives that.
  4. Is the artwork light-coloured? If so, flattening onto white will hide it. Composite it onto the real background first.
  5. Keep the original. Flattening is one-way.

Summary

A conversion can destroy transparency without any visible warning at the moment it happens. The file converts successfully, the download works, and the problem only appears when the image lands on a coloured background somewhere else.

So when transparency matters, stay in the alpha-capable family: PNG, WebP, AVIF. Convert to PNG or WebP freely, convert to JPG or GIF only when something is genuinely demanding it, and check the result before you use it.

Every route page on this site states, for that specific conversion, whether alpha survives or flattens. That note is generated from the two formats involved, with no generic disclaimer behind it.