Match --foreground
A hunt for this site's bone ink on your own screen. Pick any pixel, in any app, and see how many steps away from the colour it is.
- published
- 2026-10-30
- status
- wip
- stack
- TypeScript · React · EyeDropper API · OKLab
https://goksen.ing/lab/match-foreground
The ink
Most text on this site is one colour, --foreground, a warm bone on a near-black ground. The rest is grey, and one red is kept for the Primary action and Faults, like the button above. This piece asks you to find the bone somewhere else: an old photo, a paper texture, a wall in a video call.
Outside the page
The EyeDropper API gives a page one pixel from anywhere on your screen, other apps included, but only after a click, and only the one pixel you pick. It runs in Chrome and Edge on a desktop. Elsewhere, the page falls back to a plain colour input, and some systems' colour pickers carry their own eyedropper.
Steps
A step is one hundredth of a unit in OKLab, a colour space built so that equal distances look about equally different. Under about two steps, most people can't tell two colours apart side by side.