ditherkit

Credits

Projects, people, and papers that influenced ditherkit — starting with dither.it.

Projects, people, and papers that shaped ditherkit. If you see your work here and want the credit worded differently, open an issue.

Influences

dither.it

dither.it is a real-time browser dithering tool that uses your webcam as its source and cycles between algorithms and palettes with keyboard / touch gestures. It's the biggest single influence on this project's scope, and the reason the library ships the specific set of algorithms and palette presets it does.

What we took from dither.it:

  • The algorithm line-up. ditherkit launched with just Floyd-Steinberg, Atkinson, and a binary threshold. Seeing dither.it render six error-diffusion variants plus Bayer side-by-side is what convinced me to add Jarvis-Judice-Ninke, Stucki, Burkes, and Bayer as first-class exports rather than leaving them as "you can build it yourself with the kernel helper".
  • The Game Boy palette as a named preset. dither.it ships B&W, RGB, and Game Boy as its three colour modes. ditherkit's palette presets started from the realisation that "Game Boy" was worth a named export even though the algorithm already accepts any Color[].
  • The pixel-size dial. dither.it has a pixel-density control (1×–64×) that downsamples the source before dithering. It's what gives the output that chunky retro feel, and it turned out to be the right abstraction to ship as a pixelSize prop on both DitheredImage and DitheredImageSSR.
  • The "show all of them" framing. The /effects gallery treats the effect library as a visual showcase first and an API second — an approach I copied directly from how dither.it leads with motion and only explains itself after you've seen the output.

dither.it has no visible author attribution, contact information, or linked source code — it's an anonymous single-page tool. If you are the author and want to be credited by name (or contacted directly), please file an issue and I'll update this page.

Algorithm authors

Every dithering kernel in @ditherkit/core is a direct implementation of published work. None of these algorithms are my own — the library's job is to package them with a consistent API.

Floyd-Steinberg dithering

Robert W. Floyd and Louis Steinberg · 1976. "An Adaptive Algorithm for Spatial Greyscale." The original error-diffusion paper, and still the default you probably want for photographs.

Jarvis-Judice-Ninke dithering

J. F. Jarvis, C. N. Judice and W. H. Ninke · 1976. "A survey of techniques for the display of continuous tone pictures on bilevel displays." A larger footprint than Floyd-Steinberg — smoother gradients at the cost of sharpness.

Atkinson dithering

Bill Atkinson · early 1980s. Popularised by the original Apple Macintosh. Only diffuses 6/8 of the quantisation error, which gives that characteristic high-contrast early-Mac look.

Stucki dithering

Peter Stucki · 1981. "MECCA — a multiple-error correcting computation algorithm." Same footprint as JJN with weights tuned to preserve more midtone detail.

Burkes dithering

Daniel Burkes · 1988. Presented in Byte magazine. Stucki's top two rows — about twice as fast as Stucki with very similar output quality.

Bayer ordered dithering

Bryce E. Bayer · 1973. "An optimum method for two-level rendition of continuous tone pictures." The deterministic, tileable, GPU-friendly ordered dither — and the look Game Boy games are associated with.

Redmean colour distance

Thiadmer Riemersma · 1996. The cheap perceptual colour-distance approximation used in findClosestColor. Not a dithering algorithm per se, but every dither pass in ditherkit that touches a colour palette runs through it.

Playground sample images

The four curated images in the /playground picker are all from Unsplash, used under the Unsplash License (free for commercial and non-commercial use, no attribution required — we're crediting voluntarily).

Libraries

ditherkit is a thin layer over heavy lifting done by other libraries. The ones below are the load-bearing dependencies.

  • Sharp — the server-side image pipeline that powers DitheredImageSSR and the ISR routes.
  • Next.js — ISR caching, next/image integration, and the framework this docs site runs on.
  • React — the component model for DitheredImage and the docs pages.
  • Fumadocs — the docs framework: sidebar, MDX pipeline, search, navigation.
  • tsdown / Rolldown — the bundler that produces the package dist/ output.
  • Vitest — the unit-test runner for @ditherkit/core.
  • Playwright — the end-to-end tests that exercise both the Vite and Next.js fixtures.

On this page