Colophon · Benford
A law spelled in weight.
Benford is a calm ledger that reads real-world numbers and tallies only the digit each one begins with. Against intuition the ones dominate at nearly thirty per cent, and the count falls away in a fixed logarithmic staircase. The signature is typographic: every digit glyph is set in a variable font whose weight tracks how often that digit leads — heavy ones, hair-thin nines — so the distribution is readable as type before you read a single number.
The concept
One fictional instrument, one job: make Benford's law felt. A stream of found figures — river lengths, city populations, physical constants, file sizes, ledger totals — pours in; each contributes only its leading digit to nine tallies. The audience is anyone who assumes the first digit ought to be a coin-toss between 1 and 9. It is not: P(d) = log₁₀(1 + 1/d).
Palette — argued from a ledger
Green and red carry marks; body copy uses the dark ink at #1E211C and a muted #4A4E43, both comfortably past 4.5:1 on the cream — the bright accent never sets small text.
Type
Roboto Flex is the whole voice — a variable face with a 100–1000 weight axis wide enough to make the frequency law legible as pure weight. IBM Plex Mono sets every number, percentage and label, so figures stay tabular and honest. The row above is the law rendered in nothing but font-variation-settings: 'wght'.
Technique & the signature
No raster, no 3D library — the whole page is SVG plus a variable font. Nine bars are SVG <rect> elements; a dashed line and per-column ticks mark the theoretical Benford height each bar rises to meet. The empirical bars come from a stream of log-uniform "found numbers" mixed with a set of genuinely real constants and geographies, whose actual leading digits are counted.
The signature is the digit glyphs. Each frame, a digit's observed frequency f maps to a weight 140 + t·860 (with t the frequency normalised across the Benford range), and that weight is written straight into the glyph's font-variation-settings. As the tally converges, the ones thicken toward black and the nines thin to a hairline — the phrase "the ones dominate" becomes something you see in the strokes, not just the bars. A short accent tick pulses over whichever column just took a hit.
At rest the instrument seeds ~2,600 numbers synchronously so the staircase is already drawn for the first paint, then streams live. Motion is eased frame-to-frame (bars and weights lerp toward target); prefers-reduced-motion renders a single settled frame with no loop, and the rAF pauses on document.hidden.
Iteration log
Drove the tally headless and read the rendered weights digit by digit. The staircase was not monotonic: digit 6 came out heavier than 4 and 5, because the curated list of real figures happened to over-represent leading sixes (Nile, Amazon, Avogadro, Planck all begin with 6). A signature that says "weight tracks frequency" is a lie if the frequencies don't descend. Fixed at the source: every procedural category now spans an integer number of decades, which makes each one exactly Benford and the mixture exactly Benford; the real-figure set was rebalanced toward the true 8-5-4-3-2-2-2-1-1 shape and its share dropped to 14%. Re-verified — the weights now fall cleanly from 1000 to ~150 across 1→9.
Enriched the signature: a short accent tick now pulses over whichever column just took a hit, pulling the eye to the live event, then eases away. Added second-read layers — the "deviation from the law" metric that shrinks toward zero as N grows, and the forensic-accounting note (invented ledgers fail this exact test) that rewards a return visit. Tuned the frame-to-frame easing (0.14) and stream cadence (230 ms) so bars and weights settle rather than twitch, and gave the incoming ledger row a crafted cubic-bezier entrance.
At 375px the two-column lower panel stacks, the source chips wrap and the brand sub-label drops, so the wordmark and nav never leave the viewport (scrollWidth stays 375). Confirmed the reduced-motion path seeds the full converged staircase and renders one static frame with no loop. Verified :focus-visible rings on both buttons and every link, DPR-independent SVG scaling, and the rAF pausing on document.hidden. Under the Chanel rule, removed one ornament — the tiny per-bar count labels beneath each percentage — which were redundant with the percentages and illegible at 375px; the column now reads cleaner. Final copy pass for specificity.