Converting Between PNG and JPG Without Losing What Matters

This is not a format-choice article

Which format an image should be in is a separate question, answered by whether it is photographic or flat-toned and whether it needs transparency, and we have covered it elsewhere. This article is about what the conversion itself costs once you have decided — and both directions between PNG and JPG have a specific failure that has nothing to do with which format was the right choice.

The two failures are opposites, which is what makes them worth learning together. PNG to JPG loses something the file had and does not tell you. JPG to PNG loses nothing, which is exactly why it is so often the wrong thing to do.

PNG to JPG: the converter picks your background colour

JPEG stores three channels and no fourth. There is no place in the format to record that a pixel is transparent, so a converter has to decide what colour that pixel becomes — and every converter decides differently, without a prompt. We tested this with a 600×400 logo rendered on transparency: 203,445 of its 240,000 pixels are fully transparent, 34,333 are fully opaque and 2,222 sit in between, on the antialiased edges of the shapes.

Two converters, same file, same target format, opposite answers. Apple's system image pipeline produced white: 95.31% of the originally transparent pixels came out as exactly 255,255,255, the rest being JPEG ringing near the edges. A browser canvas — the mechanism behind a great many online converters — produced black: 94.82% came out as exactly 0,0,0. Neither offered a choice, and the difference is invisible in a file browser preview, because that preview usually sits on a light background where the white version looks perfect and the black version looks like a deliberate design.

The size of the mistake is easy to put a number on. We composited the original correctly over white — what a designer would have wanted — and compared. The black-flattened JPEG differs from that correct result by a mean of 217.60 levels across the whole frame, because 84.77% of the frame is now a black rectangle instead of nothing. The white-flattened version differs by 0.32 levels: essentially right, on a white page. On a dark page the two swap places. The point is not that white is correct; it is that the converter made a decision about your design and did not mention it.

The fringe is worse than the rectangle

A black or white box around a logo is at least obvious. The damage that gets shipped is at the edges. Those 2,222 partially transparent pixels are the antialiasing that makes curves and type look smooth, and each of them is a blend that has not been resolved yet. When the converter flattens onto the wrong colour, they blend toward that colour instead of toward your page.

One pixel from our test shows it exactly. At coordinates 244,59 the source stores the colour 28,76,217 — a strong blue — with an alpha of 120, meaning it covers 47% of that pixel. Composited over white, as intended, it should read 148,171,237: a pale, soft blue that makes the curve look smooth. In the black-flattened JPEG it reads 16,39,89: nearly black. Across all 2,222 fringe pixels the mean error against the correct composite is 141.04 levels, against 6.54 for the white-flattened version. Put that logo on a white page and it is not just boxed in — it is outlined in a dark halo that no amount of scaling or re-exporting will remove, because it is now the actual pixel data.

JPG to PNG: lossless, and therefore useless

This is probably the single most common wasted conversion on the web, and it comes from a reasonable-sounding intuition: PNG is the lossless format, so putting the image in PNG should protect it. It does — from any further loss. It does nothing about the loss that already happened, because that loss is not stored somewhere separate. The JPEG's quantised, blocky, ringed pixels are the image now, and PNG's job is to reproduce exactly what it is given.

We measured it on a real file. The 1600×900 photograph at quality 75 is 314,890 bytes. Converted to PNG it is 1,501,885 bytes — 4.76 times larger. We confirmed the two are identical by decoding both to raw bitmaps: 4,320,054 bytes each, and the same SHA-256 hash. Not one pixel improved; the file simply got five times heavier to serve.

The ratio gets worse as the JPEG gets worse, which is the counter-intuitive part. At quality 90 the same photograph is 426,601 bytes and its PNG is 1,587,574 — a 3.72× penalty. At quality 30 the JPEG is only 92,816 bytes but the PNG is still 1,061,895 — a penalty of 11.44×. The reason is that PNG compresses by predicting each pixel from its neighbours, and a heavily compressed JPEG is full of 8×8 block edges and ringing that no predictor expects. You are paying a million bytes to store artefacts precisely. If a platform demands PNG, give it PNG; otherwise this conversion is a bill with nothing on the other side of it.

The detail that makes JPEG wrong for coloured text

JPEG does not encode red, green and blue. It converts to one brightness channel and two colour-difference channels, and then — by default — it stores the colour channels at half resolution horizontally and vertically. That is chroma subsampling, and it is a good trade on a photograph, where colour changes slowly. It is a bad trade wherever colour changes at a hard edge, which is exactly what coloured text is.

We rendered a 1000×360 test sheet with three bands of the same sentence on white: neutral black, saturated red, saturated blue. At quality 75 the black band's mean error is 0.365 levels per pixel with a chroma error of exactly zero, because grey text has no colour to lose. The red band's error is 1.265 with a chroma component of 0.862. The blue band's error is 2.362 with a chroma component of 1.783 — six and a half times the black band's total error, on the same file, at the same setting, with the same typeface. Counting only pixels that were pure white in the source, 6.8% were contaminated in the black band, 19.1% in the red band and 36.1% in the blue.

The part that surprises people is that raising the quality barely helps. We read the sampling factors straight out of the files: at quality 75 and at quality 90 our encoder writes the same subsampled layout, and only at quality 100 does it switch to full-resolution colour. So going from 75 to 90 grew the file from 80,122 to 98,578 bytes and improved the blue band from 2.362 to 2.116 — 23% more bytes for a 10% better result. Quality 100 finally fixes it, taking the blue band to 0.143, at 213,085 bytes. The PNG of the same page is 57,854 bytes and exact. When the image is coloured text, the quality slider is not the control you are looking for; the format is.

Frequently asked questions

Why did my logo get a white box around it?

Because you converted a PNG with transparency to JPG, and JPEG has no alpha channel, so the converter composited the transparent area onto a background colour it chose on its own. Ours chose white in one tool and black in another on the identical file. The fix is to flatten the artwork yourself onto the colour of the page it will sit on before converting — or to keep the PNG, if the transparency is the point.

Does converting a JPG to PNG improve the quality?

It cannot. We converted a quality-75 JPEG to PNG and decoded both to raw bitmaps: byte-for-byte identical, same SHA-256 hash. The only thing that changed was the file size, from 314,890 bytes to 1,501,885. The conversion is genuinely lossless, and that is the point — lossless means it copies what it was given, including every block edge and every ring the JPEG already contained.

When is converting JPG to PNG actually the right call?

When the reason is about the next step rather than the image. A lossless intermediate while you edit, so that saving repeatedly does not requantise the picture each time. A tool, printer or platform that accepts nothing else. A file you are about to cut out and add real transparency to, which JPEG cannot store at all. In every one of those cases the PNG is a working file, not a deliverable — publish the JPEG, or better a WebP, when you are finished.

Can I raise the JPEG quality to fix blurry coloured text?

Barely, and not for the reason you would expect. The blur on coloured text comes from chroma subsampling, which most encoders keep switched on until the very top of the quality scale. We read the sampling factors out of our own files: quality 75 and quality 90 use the same subsampled colour, so raising the setting grew the file by 23% and improved the blue text band by only 10%. Quality 100 finally encodes colour at full resolution and does fix it — at 213,085 bytes against 57,854 for the same page as a PNG. Use PNG.

Is the transparency really gone, or is it just hidden?

Really gone. JPEG has three channels and no fourth one to hide anything in. Once the file is written, a formerly transparent pixel is an ordinary opaque pixel of whatever colour the converter chose, and it is indistinguishable from a pixel the designer painted that colour on purpose. Converting the JPEG back to PNG gives you an alpha channel again, but it is fully opaque everywhere. Keep the original PNG.