Photos in four colors: what dithering is good for

Dithering is an old trick. When a screen can only show a few colors, you mix them in a pattern and let the eye blend them. A photo in four colors can still look like a photo, as long as you squint.

We use it on our own site because it makes every picture feel like it belongs to the same family. A grainy photo of a mug and a bright photo of a street suddenly share a language.

When it works

Dithering is good at three things.

First, it unifies. Clients rarely have a consistent set of photos. Dithering them all to the same palette makes the site calm.

Second, it's light. A picture with four colors compresses well, so pages open quickly even on a bad connection.

Third, it's playful. People smile when they see their own face in pixels.

When it doesn't

Dithering struggles with faces in low light, with fine text inside photos and with products where color matters. A coffee bag in four colors might lose the very thing a customer wants to see.

That's why we always let the original come back. On our site, hovering over a picture shows the full-color photo for a moment. You get the mood first and the detail second.

Three settings that matter

The palette is the biggest choice. Pick colors that already live in the brand.

The pixel size comes next. A small pixel keeps the photo readable. A big pixel makes it more of a poster.

The pattern is last. A regular pattern looks tidy and old-fashioned. A noisy pattern looks rougher and warmer.

Try a few sizes with the same picture before you decide. You'll know when it looks right, usually within a minute.

If your photos are the whole point of the page, keep them in color and use dithering for the smaller things around them: thumbnails, backgrounds and team portraits.