Raising the JPEG quality to 95 to fix blurry red text, when the damage comes from 4:2:0 chroma and needs 4:4:4 instead.
Compression
Chroma subsampling
Also called 4:2:0, 4:4:4 or chroma sub-sampling. Here is what it means, when it changes what you export, and what people get wrong.
The short answer
Chroma subsampling stores colour information at a lower resolution than brightness, because human vision resolves fine detail in brightness far better than in colour. Written as ratios such as 4:4:4, 4:2:2 and 4:2:0, it cuts file size cheaply on photographs but smears saturated edges, coloured text and thin graphics.
Updated
The short version
Chroma subsampling at a glance
| Quick fact | Detail |
|---|---|
| Notation | Region width : top row samples : bottom row samples |
| Full colour | 4:4:4, one chroma sample per pixel |
| Web default | 4:2:0 in most JPEG, WebP and AVIF encoders |
| Colour data dropped at 4:2:0 | Three quarters of the chroma samples |
| Applies to | Lossy codecs, not PNG or lossless modes |
Slide the table sideways to see every column.
How does it actually save space?
Before compressing, a JPEG or WebP encoder converts the image out of RGB into a luma plus chroma representation: one channel carrying brightness, two carrying colour difference. Those three channels can then be treated separately.
Your eye has far more receptors for light level than for colour, and the visual system pools colour information over larger areas. So the encoder keeps the brightness channel at full resolution and shrinks the two colour channels, often to half width and half height. That discards three quarters of the colour samples before any quantisation happens at all, and on most photographs you cannot see it.
How do you read 4:2:0 and 4:4:4?
The notation describes a reference region four pixels wide and two pixels tall. The first number is the width of that region, the second is how many colour samples are taken across the top row, and the third is how many additional colour samples are taken across the bottom row. Zero in the third position means the bottom row reuses the top row's colour.
| Mode | Colour resolution | Typical use |
|---|---|---|
| 4:4:4 | Full, one colour sample per pixel | Graphics, text, logos, screenshots, masters |
| 4:2:2 | Half horizontally, full vertically | Video capture and editing, a middle ground |
| 4:2:0 | Half horizontally and vertically | Default for web JPEG, WebP, AVIF, most cameras |
Most encoders switch to 4:4:4 automatically at their highest quality settings, but the threshold varies by tool, so check rather than assume.
Why does 4:2:0 wreck red text on white?
Because that edge lives almost entirely in the colour channels. Bright red and white are not far apart in brightness, so the luma channel, the one kept at full resolution, records only a faint change. Nearly all the information defining the edge sits in the chroma channels, which have just been halved in both directions. The result is a soft, smeared, sometimes fringed edge that no amount of raising the quality slider will sharpen.
The same failure hits thin coloured lines, saturated logos on pale backgrounds, price badges, packaging small print and any screenshot of coloured UI. Force 4:4:4 for those, or step outside lossy coding entirely and use PNG or lossless WebP. For ordinary product photography and general photographs, 4:2:0 is close to free and worth keeping.
What people get wrong about chroma subsampling
Each one is a real failure mode, not a style preference.
Assuming 4:4:4 costs a lot of file size on ordinary photographs, when the difference is often modest and worth it for graphics.
Exporting screenshots and UI mockups through a default web encoder, which subsamples coloured interface elements into mush.
Believing the ratio numbers describe colour depth or bits per channel rather than sampling positions.
Questions people ask
Chroma subsampling, answered
The follow-up questions people search for once they have the definition.
Should I always use 4:4:4?
No. For photographs it usually adds size for no visible gain, since your eye cannot resolve the extra colour detail. Use 4:4:4 when the image contains coloured text, logos, thin graphic lines or screenshots, where the edges depend on chroma resolution.
Does PNG use chroma subsampling?
No. PNG stores full RGB values for every pixel and is lossless, so there is no chroma plane to subsample. The same is true of lossless WebP. Subsampling belongs to lossy codecs such as JPEG, WebP lossy, AVIF and video formats.
Can you tell which subsampling a JPEG used?
Yes. Most image inspection tools and command line utilities report the sampling factors from the file's headers. Visually, look at a saturated coloured edge against a light background at full zoom, where 4:2:0 shows a soft blocky fringe.
Why do my product photos look fine but the packaging text does not?
The photograph is full of texture that hides the loss, while printed text is a hard high-contrast edge, often in a brand colour. Subsampling halves the colour resolution defining that edge, so the small print goes soft while everything around it looks acceptable.
Same cluster
More from the glossary
Neighbouring entries, so every term in the set is one hop from every other.
Chromatic aberration
Chromatic aberration is a lens fault where different wavelengths of light do not come to focus in the same place, leaving coloured outlines along high-contrast edges.
Checkerboard pattern
The grey and white checkerboard behind an image is not part of the picture.
Clipping path
A clipping path is a vector outline drawn around a subject so that everything outside the line is hidden.
From the studio
Tools that do this
Each one runs on your own device, so the photo stays where it is.
Sources
Where the facts on this page come from. Every link opens the specification, standard or documentation the claim was read at.
Keep reading
Elsewhere on Photomop
Platform image rules
Image size, file type and background rules for 22 selling platforms, each one sourced.
Read itConvert image
JPG, PNG, WebP and AVIF, with an honest answer about HEIC and alpha.
Read itAll the tools
The whole toolbox in three families, with what each one needs before it can run.
Read itOn-device privacy
The pipeline in five steps, what leaves your device, and how to check it yourself.
Read it
Now do it to a photo
Photomop is a photo studio that runs on your own device. Resize, crop, compress, convert, batch edit, remove a background and change one all work in the browser tab you are reading this in, at full resolution and with no watermark. The on-device page shows you how to check that the photo stays put.