Transparent Backgrounds: PNG vs WEBP vs GIF

A “transparent background” means part of an image has no color at all, so whatever is behind it — a website’s background, a slide, another image — shows through. Only some image formats can store that information, and it’s easy to lose it by accident when converting between formats.

Which formats support transparency

• PNG — full support, via an alpha channel that can store not just “transparent or not” but every shade of partial transparency (useful for soft shadows and anti-aliased edges). This is the standard choice for logos, icons, and any graphic meant to sit on top of other content.
• WEBP — also full alpha-channel support, at a smaller file size than the equivalent PNG. If the software you’re using supports WEBP, it’s a strictly better choice than PNG for a transparent image.
• GIF — transparency support, but only as a hard on/off switch per pixel — no partial transparency, which means soft or anti-aliased edges around a transparent GIF often show a visible jagged fringe.
• HEIC — supports transparency, though it’s rarely used for that purpose since HEIC is primarily a photo format.
• JPG and BMP — no transparency support at all. There’s no “mostly transparent JPG” — the format simply has no way to represent it.

What happens when you convert to a format that doesn’t support it

If a source image has a transparent background and you convert it to JPG or BMP, the transparent areas don’t just disappear cleanly — they get filled in with a solid color (white, by default, in this tool and most converters) wherever the alpha channel used to be. This is usually the cause of a mysterious white box appearing around a logo after a “quick” format conversion. If you need to keep transparency, the destination format has to support it — convert to PNG or WEBP instead.

Picking between PNG and WEBP for a transparent image

Both preserve transparency fully, so the choice usually comes down to where the image is going:

• For a website — WEBP, for the smaller file size (see our WEBP explainer) — every current browser supports it.
• For software that might not support WEBP (some older editors, some legacy tools) — PNG, for maximum compatibility.
• For further editing in Photoshop, GIMP, or similar — PNG, since it’s the more universally supported lossless format for that purpose.

A quick way to check if you’ve lost transparency

After converting an image, open it over a colored or patterned background (many image viewers and editors show a checkerboard pattern behind transparent areas). If you see a solid white rectangle where there should be a transparent area, the destination format didn’t support transparency — re-convert to PNG or WEBP instead.