Every lossy image encoder gives you a quality number, usually from 1 to 100. Almost every tutorial tells you to use 85 and moves on. That advice is good, but it is worth knowing what the dial is attached to, because the cases where 85 is wrong are predictable.
On this site the dial is labelled Cold, Warm and Hot, at roughly 60, 85 and 95. The numbers were never a percentage of anything, and naming them as temperatures at least doesn’t imply false precision.
What the number is not
It is not a percentage of the original quality. Quality 50 does not mean “half as good”. There is no scale on which that would be meaningful.
It is not a percentage of the file size either. Quality 50 does not produce a file half the size of quality 100.
And it is not comparable between formats. JPEG quality 85, WebP quality 85 and AVIF quality 85 are three different numbers feeding three different encoders with different internal scales. WebP at 85 is generally closer to JPEG at 90, and AVIF’s scale is different again. Never assume a setting transfers.
What it actually controls
In JPEG, the quality number selects a quantisation table, a grid of divisors applied to the frequency components of each 8×8 block of the image.
The encoder converts each block from pixel values into a set of coefficients describing patterns at different frequencies: low frequencies for the broad shape and colour of the block, high frequencies for fine detail and edges. It then divides each coefficient by the corresponding number in the quantisation table and rounds to a whole number.
That rounding is where the loss happens. Divide by a large number and most small coefficients round to zero, and long runs of zeros compress to almost nothing. Divide by a small number and more of them survive, which preserves detail and costs bytes.
So the quality setting answers one question: how aggressively should fine detail be rounded away? The table is weighted so that high-frequency components, the ones your eye is least sensitive to, are divided hardest.
WebP and AVIF work differently in the specifics, but the shape is the same. The quality number scales how much precision the encoder is allowed to discard.
Why the curve is not a straight line
The relationship between quality and file size is steeply non-linear, and this is the practical fact worth internalising.
| Setting | Typical size vs. quality 100 | What you can see |
|---|---|---|
| 100 | 100% | Nothing gained over 95, at large cost |
| 95 | ~40% | Effectively indistinguishable from the original |
| 85 | ~25% | Artefacts findable only by pixel-peeping |
| 75 | ~18% | Slight softening in fine texture |
| 60 | ~12% | Visible blocking in flat gradients; fine for thumbnails |
| 40 | ~8% | Obvious artefacts, mushy detail |
| 20 | ~5% | Clearly degraded |
The exact figures vary with image content, but the shape holds. Going from 100 to 95 costs you almost nothing visually and saves around 60% of the file. Going from 95 to 85 saves another large chunk for a difference most people cannot find. Going from 85 to 75 starts to be noticeable on textured content. Below about 70 the losses become obvious in exactly the places people look: skies, skin, and any smooth gradient.
This is why 85 became the default everywhere. It sits just past the knee of the curve, so you have taken nearly all the available savings and have not yet started paying for them in visible damage.
When to move off 85
Go hotter (92-95) when:
- The image will be cropped or zoomed later. Artefacts that were invisible at full frame become obvious at 300%.
- It is a hero image, a portfolio piece, or anything where the picture is the product.
- The image has large smooth gradients, such as a clear sky, a studio backdrop or a soft shadow. Gradients are where JPEG banding shows first.
- It is going to be edited and re-saved. Start with more headroom.
Go colder (60-75) when:
- It is a thumbnail, an avatar, or anything displayed at a few hundred pixels. Nobody will ever see the difference at that size.
- Page weight genuinely matters: a long gallery, a mobile-first page, a slow connection.
- The image is busy and textured. Noise and detail hide artefacts remarkably well, and a photo of gravel survives quality 60 far better than a photo of a sunset.
Stay at 85 when you have no specific reason from the lists above. It is the default because it is right most of the time.
Where the dial does nothing
Two cases ignore the quality setting entirely.
Lossless targets store every pixel exactly. Converting to PNG, or to WebP in lossless mode, leaves nothing to discard, so the number is irrelevant. File size is determined entirely by how much repetition the compressor finds in your image.
GIF has no quality dial. Its constraint is a hard 256-colour palette limit, and the only meaningful decision is how the palette is chosen. Building it from your actual image, and skipping a fixed web-safe swatch, determines whether the result looks acceptable.
The mistake that costs the most quality
Choosing 80 instead of 85 costs little. Re-encoding repeatedly costs the most.
Each lossy save runs the whole quantisation process again, on data that has already been quantised once. The second pass has no way to know which detail was original and which was already an artefact, so it compounds the damage. Save a JPG at quality 85 five times in a row and the result is visibly worse than a single save at quality 60 would have been, and dramatically larger, because artefacts are high-frequency detail that the encoder now has to spend bits preserving.
The practical rules that follow:
- Always convert from the best original you have, not from a previous conversion. If you have the camera file or the export from your editor, start there.
- Do all your editing first, in a lossless format if the tool allows, and encode to a lossy format once at the end.
- Never round-trip through a lossy format to change something small. Going JPG → PNG → JPG to crop an image costs you a full generation of quality for nothing.
Choosing on this site
The temperature dial applies to JPG and WebP output:
- Cold (~60): thumbnails, galleries, anywhere weight beats fidelity.
- Warm (~85): the default, and correct for almost everything.
- Hot (~95): hero images, anything to be cropped, anything with big smooth gradients.
PNG output ignores it entirely, and GIF output uses its palette process instead. Whatever you pick, the finished ticket shows the real output weight for your specific file, which beats any table, including the one above, because your image’s content is what actually decides.
If you are still choosing a target format and not a quality level, start with which format to use.