accessible-ink-scalelisted
Install: claude install-skill fernandokylas/editorial-web-craft
# Accessible Ink Scale
A font's stroke doesn't shrink proportionally with its size — at 12px a 400-weight sans has strokes about one pixel wide, anti-aliased into grey, and on a glossy screen in daylight those strokes simply aren't there. Letter shapes also crowd: the counters and gaps that make "rn" different from "m" close up as the size drops. And on a dark ground, light strokes bleed outward (halation), which the eye reads as *thinner* letters, not brighter ones. Print typographers solved this a century ago with optical sizes — a 6pt cut of a face was drawn heavier and wider than the 12pt cut. On the web you do it by hand: as text scales down or inverts, add weight, open tracking, and open leading. It's not styling; it's keeping the ink on the page.
## The three compensations
**1. Weight steps up as size steps down.** Below 14px (`0.875rem`) the regular weight erodes — move to 500. At 12–13px or anything uppercase, 600. Variable fonts let you land between (`font-weight: 520`); use the axis. This isn't emphasis — the small text should still look *quieter* than body, which colour and size handle. Weight just keeps its strokes solid.
**2. Tracking opens as size drops.** Body text at 1rem sits at `letter-spacing: 0`. At ≤13px, add `0.02–0.04em` for lowercase. Uppercase needs far more — `0.08em` minimum at any size, `0.12em` at 0.75rem — because caps have no ascender/descender rhythm to separate them and pack into a wall. (These are the shared floors for the whole skill se