JPEG Compression Artefacts Explained: Blocks, Halos and Banding (and How to Reduce Them)

Why JPG images get blocky squares, fuzzy halos and stripy skies, how to recognise each artefact, and practical ways to avoid or reduce them.

By the ClearPix team · · 4 min read

Zoom into almost any image that has been shared online a few times and you will see it: small square tiles in smooth areas, a faint shimmering fuzz around text and edges, and skies that look like a stack of coloured stripes instead of a smooth gradient. These are JPEG compression artefacts. They are not random damage. Each one comes from a specific part of how the JPG format works, which also means each one has a specific fix.

How JPG compression works, in brief

JPG makes photos small by throwing away information that people are unlikely to notice. Roughly, it does four things:

  1. Separates brightness from colour, then stores colour at a lower resolution. Our eyes are much more sensitive to brightness than to colour, so this saves a lot of space almost invisibly.
  2. Splits the image into blocks of 8 × 8 pixels.
  3. Describes each block as a mix of smooth and detailed patterns (a mathematical step called the discrete cosine transform).
  4. Rounds off the fine-detail patterns, more aggressively at lower quality settings. This rounding is where the information is actually lost.

At high quality the rounding is gentle and you cannot see it. At low quality, or after several rounds of re-saving, the shortcuts become visible.

The three artefacts you will see most

1. Blocking

Because each 8 × 8 block is compressed on its own, neighbouring blocks can end up with slightly different average colours. In smooth areas such as skin, walls and sky, the grid becomes visible as a pattern of faint squares. Blocking is the clearest sign that an image was saved at low quality.

2. Ringing (halos or "mosquito noise")

Sharp edges, like text on a background or a dark branch against the sky, need lots of fine-detail patterns to describe. When those are rounded away, the edge cannot be described precisely, and a faint shimmering fuzz appears around it. It is most obvious on screenshots, logos and graphics, which is why those should be saved as PNG instead.

3. Banding and colour smearing

Gentle gradients, like a sunset, can break into visible stripes when subtle tonal steps are rounded off. Separately, because colour is stored at lower resolution, thin coloured details such as red text or a thin coloured line can look smeared or bleed into their surroundings.

Why images get worse every time they are shared

Messaging apps and social networks usually re-compress images when you upload them, to save storage and bandwidth. When someone downloads that image and shares it again, it is compressed again. Each round adds a little more loss, and the damage is cumulative. A meme that has been forwarded dozens of times is often a lesson in every artefact on this page.

How to avoid artefacts in the first place

  • Save photos at 85–92% quality. Below about 75%, artefacts become noticeable on most screens.
  • Use PNG for screenshots, text, logos and diagrams. Lossless formats have no ringing at all.
  • Keep an original. Edit from the original file and export a JPG only at the end.
  • Avoid re-saving. Rotating or cropping a JPG and saving it again applies another round of compression in most editors.
  • Send originals as files when possible. Many chat apps compress photos sent normally but keep them intact when sent as a document or file.

How to reduce artefacts in an existing image

Once detail has been rounded away it cannot be recovered exactly, but artefacts can be made much less noticeable.

  • Find a better copy first. A quick reverse image search may turn up a larger, less compressed version of the same picture.
  • Use denoising before enlarging. In our AI upscaler, the denoise slider smooths compression blocks and mosquito noise before the neural network rebuilds the edges. For heavily compressed web images, start around 40–50%; for decent camera JPGs, 15–25% is enough.
  • Upscale moderately. A 2x enlargement of a cleaned image usually looks better than the original at its own size, because the network redraws edges cleanly instead of reproducing the halos.
  • Save the result losslessly. Download as PNG so you do not immediately add a new round of compression. If you must deliver a JPG, convert at 90% or higher with the PNG to JPG converter.

Is WebP any better?

Lossy WebP uses a more modern compression method and tends to produce softer, less blocky artefacts than JPG at the same file size. It still loses detail, though, and repeated re-saving harms it just as it harms JPG. For anything that needs to stay perfect, use PNG or lossless WebP. Our comparison of PNG, JPG and WebP covers the trade-offs in more detail.

Summary

  • Blocks come from the 8 × 8 grid; halos come from rounding away fine detail at edges; banding comes from rounding away subtle tones.
  • Every re-save and every upload to a social network can add more damage.
  • Prevent artefacts with sensible quality settings, lossless formats for graphics and by always working from originals.
  • Reduce existing artefacts by finding a better source, denoising, upscaling moderately and saving as PNG.

Try it yourself

Free, no sign-up, and your images never leave your device.

More guides