What is dithering?

Dithering draws an image with only a few colors. It scatters pixels of the colors you have, so from a distance they mix into the shades you don't have. A checkerboard of black and white pixels reads as gray. Early computers and game consoles had to work this way. It's still used for electronic paper screens, thermal printers, small GIFs, and retro pixel art.

Tool description

Open an image, pick a method and a palette, and the tool dithers it right away. Raise the pixel size to make every dithered pixel a bigger block for a chunky retro look. The before and after slider shows how much of the original survives. PNG is the default download, since it keeps every pixel exactly as dithered.

Features

  • Three methods: Floyd-Steinberg, Atkinson, and ordered (Bayer 8×8)
  • Four palettes: black and white, 4 grays, 8 colors, and 16 colors
  • Adjustable pixel size for big retro pixels
  • Keeps transparency

How it works

Floyd-Steinberg rounds each pixel to the nearest palette color and passes the rounding error on to the pixels to the right and below. The errors add up into fine, natural looking noise that keeps the overall tones. Atkinson, from the first Apple Macintosh, passes on only three quarters of the error. Highlights and shadows go flat, and the result has more contrast. Ordered dithering adds a fixed 8×8 pattern of offsets instead, which gives a regular crosshatch texture.

The 8 colors are the corners of the RGB cube: black, white, red, green, blue, cyan, magenta, and yellow. The 16 colors are the IBM CGA palette of early PCs. The gray palettes dither the brightness only.

Tips

  • Floyd-Steinberg suits photos, Atkinson suits line art and bright, high contrast images.
  • Ordered dithering gives the same pattern in every frame, so it flickers less in GIF animations.
  • Pixel sizes of 2 to 4 give an old computer look at modern screen sizes.
  • Keep the PNG format. JPG blurs the dithered pixels and adds colors that aren't in the palette.