Transparent Background Explained: PNG vs WebP vs JPG

A transparent background means the pixels around your subject have no color at all, so whatever sits behind the image shows through. That information lives in an alpha channel, and only some file formats can store it. PNG and WebP keep it. JPG throws it away. Most "my transparent image turned black" problems come down to one of those two facts.

This guide explains what the alpha channel is, compares the formats you are likely to meet, and lists where transparency survives in common apps like Canva, Word, Google Slides, Shopify and WhatsApp.

What a transparent background actually is

A transparent background is an image area whose pixels have an opacity of zero. Every pixel in a normal photo has three numbers, red, green and blue. A transparent-capable image adds a fourth number, alpha, that says how opaque that pixel is.

The PNG specification from the W3C puts it plainly: the alpha sample determines a pixel's degree of opacity, where zero means fully transparent and the maximum value means fully opaque. In an 8-bit image the maximum is 255, so alpha runs from 0 to 255.

Three things follow from that definition:

• Transparency is not a color. White is a color with alpha 255. A transparent pixel has alpha 0, and its red, green and blue values do not matter for display.
• Transparency is not all or nothing. Values between 0 and 255 let some of the background through. That is how hair, fur, smoke, glass and soft shadows look natural on a new background.
• The checkerboard is only a convention. Editors draw a gray-and-white checkerboard behind transparent areas so you can see them. It is not part of the file.

Why partial transparency matters

A cut-out with only fully clear and fully solid pixels has a hard, stair-stepped edge. Real edges are rarely that clean. A strand of hair might cover 40% of a pixel, so the right alpha for that pixel is about 102, not 0 or 255. Good background removers produce these in-between values; a crude one does not. If you want the mechanics of how a model decides those values, see how AI background removal works.

Which formats support transparency

PNG, WebP, AVIF and GIF can store transparency. JPG cannot. HEIC can in theory but rarely does in practice. Here is how they compare, based on MDN's image format guide and each format's own documentation.

PNG

PNG is the safe default for a transparent image. It is lossless, so edges stay exactly as the cut-out tool made them, and every mainstream browser and office app opens it. The PNG specification allows alpha at 8 or 16 bits per sample. The cost is size: a full-resolution photo cut-out as PNG is often several megabytes.

WebP

WebP keeps full 8-bit alpha in both its lossy and lossless modes, according to Google's WebP container specification. Google's WebP FAQ says lossless WebP images are 26% smaller than PNGs and that the maximum size is 16383 by 16383 pixels. It is a strong choice for websites. Its weak spot is office software, which often does not list it.

AVIF

AVIF supports alpha and compresses very well. MDN notes it works in current Chrome, Edge, Firefox and Safari, but recommends a fallback format for older browsers. Desktop and office apps support it less often, so treat it as a web-delivery format, not a format to email to someone.

GIF

GIF supports transparency, but MDN describes it as a single color marked transparent, so each pixel is either fully clear or fully solid. On a photo cut-out this produces a jagged, sometimes white-fringed edge. GIF is also limited to 256 colors. Do not use it for photos.

JPG

JPG has no alpha channel. Every JPG pixel is fully opaque. When you save a cut-out as JPG, the software has to fill the empty area with something, and it picks a solid color. That is fine if you want a white background for a product listing, and wrong if you want transparency.

HEIC

HEIC is the format iPhones use for photos. The underlying HEIF container can carry an alpha plane as an auxiliary image, but camera photos do not include one, and few apps write or read transparent HEIC. If you start from an iPhone photo, export the cut-out as PNG or WebP.

Why transparent images turn black or white

A transparent image turns black or white when something along the way discards the alpha channel. The pixels in the "empty" area still have red, green and blue values; they were simply hidden by alpha 0. The PNG spec notes that color values are not premultiplied by alpha, so those hidden values can be anything. Many tools store them as black, which is why black is the most common surprise.

The usual causes:

1. Saving or converting to JPG. The converter fills the background with white or black, depending on the program.
2. A destination that does not support the format. If an app cannot read WebP or AVIF alpha, it may refuse the file or render it flat.
3. A messaging or social app recompressing the image. Apps that shrink photos to save bandwidth may re-encode them in a format without alpha. Sending the file as a document instead of a photo avoids recompression in apps that offer that option.
4. A screenshot. A screenshot captures what is on screen, including the checkerboard or white page behind the image. The result is never transparent.
5. A "transparent PNG" download that is fake. Some image sites paint a checkerboard into an ordinary picture. Put it over a colored background and the checkerboard stays.

How to test whether a file is really transparent

Place the image on a colored background, for example a dark slide in a presentation or a colored page in Canva. If the area around the subject takes on that color, the file has real transparency. If you see white, black or a checkerboard, it does not.

Where transparency survives: Canva, Word, Slides, Shopify, WhatsApp

Transparency survives in any destination that accepts PNG, because PNG's alpha channel is universally understood. Problems start with WebP, AVIF and HEIC, which are missing from several apps' supported lists.

Try your own combination:

Canva

Canva accepts PNG, JPEG, HEIC/HEIF and WebP uploads, with images under 50 MB and no more than 250 million pixels. A transparent PNG you upload keeps its transparency and sits cleanly on any background in your design. Downloading a whole design as a transparent PNG is a separate feature that Canva lists under its paid plans.

Microsoft Word and PowerPoint

Office keeps PNG transparency when you insert the file. Microsoft's own Set Transparent Color tool can make one color clear, but Microsoft says it works best on simple, solid-color pictures like clip art. On a photo, cut the subject out first and insert the PNG. Microsoft also notes that when you print, transparent areas take the color of the paper.

Google Slides

Google's Slides documentation lists PNG, JPEG and GIF, with a 50 MB and 25-megapixel limit. A transparent PNG works. A WebP or HEIC file is not on that list, so convert it to PNG before you insert it.

Shopify

Shopify accepts transparent PNG and WebP product images and says PNG is the best file type for most product images, with 2048 by 2048 px recommended for square photos. A transparent product image will show your theme's background color behind it. Many marketplaces require a solid white main image instead; see our guide to white background product photos.

WhatsApp stickers

WhatsApp's sticker-pack specification requires exactly 512 by 512 pixels, WebP format, 100 KB or less per static sticker, and a transparent background. A pack holds 3 to 30 stickers, and the tray icon is a separate 96 by 96 px image. To make one from a cut-out, remove the background, place the subject on a square transparent canvas with some margin, and export a small WebP.

How to make a transparent PNG from a photo

To make a transparent PNG, cut the subject out with a background remover, check the edges, and export as PNG or WebP rather than JPG. The steps are the same on most tools:

1. Start with the largest version of the photo you have, not a screenshot or a messaging-app copy.
2. Run the background removal and look closely at hair, glass and shadows.
3. Touch up any areas the tool got wrong.
4. Choose a transparent background and export as PNG (or WebP for the web).
5. Test the file over a colored background before you rely on it.

WipeMark does this in the browser for free, with no sign-up and no watermark. It accepts JPG, PNG, WebP and HEIC up to 25 megapixels and lets you download the cut-out at full size as PNG, JPG or WebP. Our step-by-step background removal guide covers the tricky edge cases in detail.

Keeping file sizes reasonable

A transparent PNG of a 12-megapixel photo can be large because PNG stores every pixel losslessly. If size matters, export WebP for web use, or resize to the size you will actually display. For print or for a marketplace that wants big zoomable images, keep the full resolution.

Quick reference

Use PNG when you need transparency and are not sure where the file will end up. Use WebP for websites and WhatsApp stickers. Use JPG only when you want a solid background, and pick the color yourself before export so the software does not pick it for you.

If you are comparing tools that make transparent cut-outs, our roundup of free remove.bg alternatives checks which ones give you the full-size file for free.