Saving transparent WebP images as JPG

JPG has no alpha channel

The JPEG format stores three colour channels. A fourth channel for opacity does not exist. A transparent pixel has no place in a JPG, so it has to take on some colour.

Programs handle this differently: some fill with white, others with black, others show a checkerboard pattern that only exists in the preview. If such an image is saved without a deliberate decision, an unexpected black or white edge often ends up in the result.

What this converter does

Before the JPEG encoding, the chosen background colour is placed as a full-surface layer beneath the image. The decoded WebP image is then drawn on top. For every semi-transparent pixel this produces a mixed colour of image colour and background – just as it looks in an image editor.

The preview shows exactly that mixture. So you can see how edges and soft shadows behave on the chosen background before you download.

Choosing the right background colour

• White is the default and fits documents, product images on white and most uploads.
• Black suits dark layouts in which the image will later sit on a dark surface.
• A custom colour makes sense when the image is embedded in an existing brand surface. Use the exact colour value of the target surface, not a similar one.

Semi-transparent edges and shadows

Soft shadows and cut-out hair consist of many partially transparent pixels. On white they look lighter and softer, on black clearly harder and darker. Once an image has been filled, it cannot be returned losslessly to another background – the information about the original opacity is gone. If you need several backgrounds, create a separate output from the original file for each one.

When you are better off staying with WebP

If transparency is to be preserved, JPG is the wrong target format. WebP stores an alpha channel and is displayed by all current browsers. For intermediate steps in image editing, a lossless format is the better choice. JPG is the right output when a program or platform does not accept WebP – in that case a deliberately chosen background colour is the clean solution.