Section tones

data-tone pins a subtree to a tonal palette by remapping the semantic surface, text, border and focus tokens, plus the status and flag pills (ADR 0013, ADR 0010). Any component inside adapts, because a component only ever reads the semantic layer — there is no tone-aware code in any block.

The tone is fixed and the shade shifts per site mode, so a tone reads as itself in both modes while still feeling native to each.dark and light hold their tone in both;inverse is whatever opposes the page; accent is the gentle same-tone raise. The mint garden tone was retired on 2026-10-12: the print material uses Spring green only as solid shapes.

Toggle the theme to watch each shade shift. Every component entry carries a tone switcher for the same reason this page exists.