PJHTech ImagesWhy does a smooth gradient show bands?
Visible steps can appear when a smooth change is represented with too few levels or damaged during processing. The export and the display can both affect what you see.
A gradient reduced to eight colors
Reducing this gradient to eight colors turns the smooth transition into bands. Dithering is off here; other GIF exports can use more colors and dithering.
Settings and measurements
| File | Dimensions | Bytes | Export settings |
|---|---|---|---|
| gradient-source.png | 768 × 192 | 793 | Optimize: True |
| gradient-eight-colors.gif | 768 × 192 | 3,155 | Optimize: False |
Python 3.14.4, Pillow 13.0.0, Platform Linux, Webp 1.6.0, Jpeg 6.2, Avif 1.4.2
Find where the bands appeared
Compare the source with the export in the same viewer. If the source is smooth and only the export is banded, inspect palette reduction, precision and compression settings.
Try a controlled change
Change one setting at a time and export from the source. Dithering can make steps less obvious by adding a pattern, but it does not restore missing source detail.
Our synthetic example deliberately reduces a gradient to a small palette. It demonstrates that one cause; it is not a diagnosis of your screen.
Related guides
- What is a GIF file?
- Why do image colors look different between apps?
- Why did an image get larger after conversion?
Sources
- CompuServe / W3C archive: GIF89a specification
- W3C: PNG specification