January 26, 2026
Chrome dithers, Firefox delivers
Dithering – Part 2: The Ordered Dithering
Retro pixel magic wins hearts — except on Chrome, where it hangs
TLDR: A visual guide explains how ordered dithering uses a Bayer pattern to turn gray into clean black-and-white. Commenters loved the teaching but sparred over Chrome freezing while Firefox worked, with retro ZX Spectrum stories and requests for the tech stack making this both educational and a browser drama.
Damar’s new visual explainer on ordered dithering — the art of turning gray into black-and-white using a patterned threshold — dropped on visualrambling.space, and the comments instantly turned into a spectator sport. Fans hyped the sequel, linking Part 1 and cheering the clean, visual walkthrough of the Bayer matrix (a pattern that spreads pixels so images look smoother). But the real show? Chrome vs Firefox became the unplanned boss fight. One user reported Chrome freezing on “Loading assets…” while Firefox breezed through — cue a flood of jokes like “the only dithering here is Chrome dithering whether to load.”
Amid the browser drama, nostalgia crashed the party. A commenter flexed old-school cred with a ZX Spectrum raytracer, reminding everyone that dithering was the OG hack for limited-color screens; they even shared a link to their retro project (here). Meanwhile, curious minds wanted the tech stack: canvas, WebGL, sorcery? The vibe was equal parts “👏 teach us” and “⚔️ fix Chrome.”
Bottom line: the crowd loved the bite-sized visual teaching and the smoothing magic of bigger Bayer matrices, but the thread’s energy was split between respect for pixel craft and browser blame memes. And yes, several folks basically said: commission this person to dither our lives.
Key Points
- •Ordered dithering uses a threshold map to determine black-or-white output for grayscale pixels.
- •Quantization converts gray shades to black or white via rounding or thresholding; threshold choice affects results.
- •Tiling a naive threshold map across an image can create visible artifacts that mirror the map’s layout.
- •A 2x2 Bayer matrix rearranges thresholds to produce a cross-hatch pattern and reduce artifacts.
- •Expanding to a 4x4 Bayer matrix introduces 16 thresholds, enabling smoother transitions between gray tones.