All examples · Shaders and post

Dither

What this example shows

dither() cuts every colour channel down to a few steps, the way the machines of the era stored colour, and hides the bands with an ordered 4×4 pattern: each pixel is nudged up or down by less than a step, so a gradient becomes a mix of two steps instead of a hard edge.

It has two numbers, both in effect.uniforms, so changing one is writing it: levels is steps per channel (COLOR_LEVELS has the real ones: 8 on a Mega Drive, 32 on a SNES) and strength is how much pattern is mixed in; at 0 it is plain posterize, bands and all.

Click to change machine, ↑ ↓ for the pattern strength and Space to switch it off. Watch the balls: the moving light makes gradients nobody drew, and that is where it shows first.

Starting