Images & photos · Image Converter & Compressor
What happens to transparency when you convert a PNG to JPEG
· How it works
image-formats transparency canvas
JPEG has no alpha channel, so transparent pixels have to become something during conversion, and the browser's rule is to composite them onto black. This post explains alpha, the compositing step and how to keep transparency by choosing WebP or PNG instead.
The product cut-out that turned into a black square — the conversion result that surprises almost everyone the first time
A product cut-out may return from JPEG conversion surrounded by a solid rectangle. In this tool that rectangle is not forced to black: the plan carries a background colour, the focused panel starts it at white, and `renderPlan` fills the entire canvas before drawing the bitmap. The output therefore reflects a visible user choice rather than an undocumented browser fallback.
Reproduce the issue with a copy of the source and note the selected matte. If a black block appears after choosing white, compare the actual downloaded file with any later processing stage before blaming the conversion. ToolAcre’s warning includes the colour placed behind transparent pixels, making the plan auditable before the JPEG encoder receives the canvas.
A surprising solid rectangle may be any chosen matte; ToolAcre defaults to white rather than black
Transparency is represented in the decoded pixel surface as opacity alongside colour. The product’s format table records that PNG and WebP outputs support alpha while JPEG does not. That is an encode capability statement: the input decoder also accepts GIF, but GIF is decode-only and contributes only one still frame. Read support and write support must not be collapsed into one list.
An alpha value lets the same foreground blend into different page backgrounds after export. Once the pixels are flattened onto a matte, that flexibility is gone because the stored JPEG contains ordinary opaque colours. Converting the JPEG back to PNG creates an alpha-capable container, but it cannot infer which pixels were formerly transparent or separate them from the chosen background.
Why JPEG cannot hold transparency — a format designed for photographs with no notion of 'nothing here'
JPEG output has no alpha channel in ToolAcre’s format facts, so a complete output needs colour at every pixel. The conversion plan supplies that colour and the renderer paints it across the destination before any source pixels are drawn. This order ensures fully transparent regions become the matte and partially transparent boundaries blend through the normal canvas composition.
Choose the matte based on where the JPEG will appear. A white catalogue page favors white; a dark slide favors its actual dark background. If the destination background may change, JPEG is the wrong deliverable because the decision would be baked in too early. PNG or WebP keeps the alpha channel available to the later layout.
The compositing rule browsers follow — transparent regions are blended onto a solid black background before JPEG encoding, by specification
The workbook described black compositing as a browser specification rule, but the implementation explicitly prevents an accidental browser-dependent fill. `fillRect` uses `plan.background`, and the panel exposes a colour input only when the chosen format lacks alpha. The correction matters: telling users that black is inevitable would hide the control built specifically to avoid that surprise.
The matte field is not decorative metadata. It changes the pixel colours sent to JPEG and should be included in a reproducible conversion record alongside format and quality. A screenshot of only the output can make a deliberate dark matte look like corruption. Capturing the plan explains whether the rectangle came from the chosen background or from a later viewer.
ToolAcre fills transparency with the user’s selected background before JPEG encoding
Soft antialiased edges contain partially transparent pixels, not merely an on-or-off mask. Their final colour depends on the matte under them during composition. A pale fringe on a dark destination can result when an object was flattened against white first; changing the page later cannot recompute those mixed boundary pixels from an opaque JPEG.
ToolAcre does not expose premultiplied-alpha buffers or promise a particular low-level decoder representation, so the evidence-based check is visual. Export the same logo against two strongly different mattes and compare its contour at native size. If the asset must work on both backgrounds, retain alpha instead of searching for one compromise JPEG edge.
Soft-edge results should be inspected against the chosen matte; premultiplication internals are not exposed
Use a transparent logo with a soft shadow. First choose white and export JPEG; then choose a dark green and export another JPEG. The transparent field should become each selected colour, while the shadow blends into it. Export unchanged-size PNG and WebP copies as well, then place both over light and dark test blocks in an image-aware viewer.
The PNG route uses a lossless encoder and keeps transparency. The WebP route keeps transparency but remains lossy according to the application’s format data, even at quality 100. The JPEG copies are necessarily opaque. No fixed file-size ranking is asserted because the browser measures real encoded bytes and content determines the outcome.
What this does not cover — choosing a custom background colour, animated transparency and 1-bit GIF-style masks
This workflow does cover a custom background colour—the original outline incorrectly excluded it. It does not preserve GIF animation, provide GIF output or offer a specialized one-bit-mask editor. GIF input is decoded as one still frame and receives the same destination-format rules as other accepted inputs.
It also does not remove a pre-existing coloured background from an opaque source. Alpha preservation helps only when transparency reaches the decoder. If the source already contains a white rectangle, exporting to PNG cannot recreate missing transparency. That task requires deliberate background removal in an editor, not a format conversion.
Custom background colour is implemented and belongs in scope
Transparency survives only in a destination that can represent it. ToolAcre makes the alternative explicit: JPEG gets a chosen matte, while PNG and WebP retain alpha under their documented encoder behavior. Read the warning before conversion because it describes a one-way pixel decision, not a reversible display preference.
Keep the original transparent asset as the master. Produce a JPEG copy only after the final background is known, and inspect soft edges on that colour. This preserves the flexible source while giving recipients an opaque file they can open, without pretending a later conversion can recover alpha that was intentionally flattened.