Dithering and Halftone Effect

How to dither an image

1. Drop an image on the drop zone, or click it to choose one. It is processed in your browser and never uploaded.
2. Pick the Effect: Dithering reduces the image to a few colours, Halftone redraws it as a screen of dots.
3. Set the Output width (px), from 16 to 4096. It starts at the original width, capped at 640 px; the height follows the aspect ratio. The effect is computed at exactly this size.
4. Adjust Brightness and Contrast if needed. Both are applied before the effect.
5. For Dithering, choose an Algorithm and a Palette. For Halftone, set the Dot size (grid pitch, px), the Screen angle and the Colors.
6. Use Zoom (Fit, 1×, 2×, 3×, 4× or 8×) to inspect the pixels, then click Download PNG.

The preview shows the result pixel for pixel with nearest-neighbour scaling, so at 1× or more you see exactly what the PNG will contain.

Dithering algorithms

Dithering fakes missing colours by mixing the available ones in fine patterns that the eye blends from a distance.

• Floyd–Steinberg (1976) is error diffusion: each pixel is rounded to the nearest palette colour and the rounding error is passed on to its neighbours (7/16 to the right, 3/16, 5/16 and 1/16 on the row below). It gives the smoothest gradients and suits photos.
• Atkinson comes from Bill Atkinson’s work on the original Macintosh. It spreads only 6/8 of the error over six neighbours and discards the remaining quarter, so the result is more contrasted, with cleaner but blown-out highlights and shadows.
• Bayer 2×2, Bayer 4×4 and Bayer 8×8 are ordered dithering: each pixel is compared with a threshold matrix that repeats across the image. There is no error propagation, which produces the regular cross-hatch pattern of old computers and games, and a pattern that stays stable from one frame to the next.
• Threshold (no dithering) simply takes the nearest colour, giving flat, posterized areas.

Palettes

• 1-bit black and white: two colours, the classic 1-bit image.
• 4 greys: black, 85, 170 and white.
• Game Boy green: the four greens (#0f380f, #306230, #8bac0f, #9bbc0f) commonly reproduced for the original Game Boy screen.
• Custom palette: type hex codes separated by commas, up to 64 colours. Each pixel is matched to the closest colour by a weighted RGB distance; invalid codes are listed and ignored.

The grey and Game Boy palettes are treated as tone ramps: the image is dithered on brightness, then each level is mapped to the ramp colour of the same rank, so the full tonal range is used. Transparency is kept when dithering.

Halftone screens

Halftone is how printing presses reproduce tones with a single ink: a grid of dots, rotated by the Screen angle, with a spacing equal to the Dot size. Each dot’s radius grows with the square root of the average ink coverage in its cell, until neighbouring dots touch in the darkest areas. Mono (black dots) prints black on white. CMYK (four rotated screens) draws cyan at 15°, magenta at 75°, yellow at 0° and black at 45° (all shifted together when you move the angle away from 45°), blended in multiply mode. Screens are rotated because identical grids laid on top of each other create moiré, a visible interference pattern. The RGB to CMYK conversion is deliberately naive (K = 1 − max(R, G, B)), without ICC profiles: this is an artistic effect, not a print-ready colour separation.

Tips

• Lower the output width for chunky retro pixels, then view at 4× or 8×.
• Raise the contrast before a 1-bit conversion so that faces and details don’t dissolve into noise.
• Use Bayer for pixel art and animations, Floyd–Steinberg for photos.
• 1-bit images are ideal for e-ink screens, thermal printers and laser engraving.