Typography & EditorialHectorpattern
Measure and Rhythm
Live axes for weight, optical size, and measure — type reviewed as a specimen, not a screenshot of a specimen.
Hector: Solid, honourable, high-craft work.
Exhibit case
Why it matters
Typography decisions made in Figma and verified nowhere else drift. A live specimen with sliders makes measure a number you can defend.
Key techniques
- Controlled inputs writing font-weight, font-size, and max-width in ch.
- Real Instrument Serif text, not lorem.
- Chamber measure as the default ceiling.
What to steal
The transferable part.ch for measure. It scales with the type, not the viewport.
What not to copy
Context-specific or costly.Do not expose every variable axis in production. Three is enough to teach.
Inclusion rationale
Apollo's instrument — the chamber page and this entry share one specimen.
Technical register
Performance
No layout thrash beyond the text block; sliders are cheap.
Mobile
Stacked controls; specimen remains readable at 390px.
Accessibility
Labels include the live value; inputs are native ranges.
Study next
Related entries
ApolloThe Aristeia ScaleSix steps with deliberate holes in the middle, set in themselves, plus a measure comparison that shows where reading breaks.Learning value: 5 of 5ApolloTabular Data TypeMonospace as a data contract rather than an aesthetic, with a proportional counter-example directly beside it.Learning value: 4 of 5ApolloOptical PairingDisplay serif against interface grotesque at intentional sizes — pairing as a ruled system, not a vibe.Learning value: 3 of 5