Dithering explained: Bayer, Floyd–Steinberg and Atkinson

Dithering is a way to show tones you don’t have. With only black and white, a dither scatters black and white pixels so that, from a distance, they average into grays. It was invented to get the most out of limited screens and printers. Today it is mostly a look: early Macintosh, Game Boy, zines, newspaper scans.

There are two families of algorithms, and they look very different.

Ordered dithering (Bayer)

Ordered dithering compares each pixel to a threshold taken from a small repeating grid, a threshold matrix. If the pixel is brighter than its threshold, it becomes light; otherwise dark. The usual matrix is the Bayer matrix, described by Bryce Bayer at Kodak in 1973, which spreads thresholds so that the patterns stay as even as possible.

• Bayer 2×2: four thresholds, so five possible tones. Very coarse, very graphic.
• Bayer 4×4: sixteen thresholds, seventeen tones. The classic cross-hatch texture.
• Bayer 8×8: sixty-four thresholds, smoother gradients, still a visible grid.

Ordered dithering is fast and stable: a pixel’s result depends only on its own value and position, so animations don’t flicker more than the image does. Its weakness is the visible grid, which is also why people choose it.

Noise thresholds

Replace the Bayer grid with noise and you get a grain instead of a pattern. Interleaved gradient noise, a formula from real-time graphics, gives an even grain without visible repeats.

Error diffusion (Floyd–Steinberg, Atkinson)

Error diffusion works pixel by pixel, left to right and top to bottom. Each pixel is rounded to the nearest available color, and the rounding error is pushed onto the neighbors that haven’t been processed yet. A gray pixel rounded to black makes its neighbors a little lighter, so one of them is more likely to become white.

• Floyd–Steinberg (1976) spreads all of the error onto four neighbors, with weights of 7/16, 3/16, 5/16 and 1/16. It keeps the most detail and gives an organic, irregular texture.
• Atkinson, written by Bill Atkinson for the original Macintosh, spreads 1/8 of the error to six neighbors. Only three quarters of the error is passed on, so light areas go cleanly white and dark areas cleanly black. The result has more contrast and looks crisper, with less noise in flat areas.

Which one to pick

• A regular, graphic texture that reads as a pattern: Bayer 4×4 or 8×8.
• The most detail from a photo: Floyd–Steinberg.
• High contrast, clean whites, the early Mac look: Atkinson.
• An even grain without a grid: noise thresholds.
• Animation: ordered or noise dithering stays steadier from frame to frame than error diffusion.

The other settings that matter

Pixel size decides how big each dither dot is. Dithering at the screen’s own pixel size makes the pattern almost invisible; at 3 or 4 pixels it becomes a texture you can see. Levels is the number of tones between the dark and light colors: two levels is pure black and white, four levels is the Game Boy. Contrast and brightness before dithering often matter more than the algorithm, because dithering shows every flat or muddy area of the source.

You can try all of this on the dither generator: six algorithms (Bayer 2×2, 4×4, 8×8, interleaved noise, Floyd–Steinberg and Atkinson), pixel size, levels, a two-color palette, and your own image as the source. If you need something it doesn’t do, such as your brand palette, more than two colors or a halftone pass, describe it in Blueprint and you get your own version.