Typography, by design.

Better typography,
built as a system.

Analyse hierarchy, spacing, scale, line length and alignment. Get practical recommendations to improve your typography.

Analyse TypographyBuild a Type System
Issue 04 — Typography
The quiet discipline of setting type well
Why measure, rhythm and contrast decide whether a page feels resolved
Most typographic problems are not mistakes of taste. They are small measurable things — a measure that runs too wide, leading borrowed from a different size, a hierarchy whose steps are too close together — and each one costs the reader a fraction of attention. Set them right and the page stops asking for effort.
“Typography exists to honour content.” — Robert Bringhurst
Analyse this layout
Figure 1 — Vertical rhythm across a 8px baseline grid.
812px measure~102 characters per line · recommended 45–75

Measured, not guessed

Line length, leading, scale conformity, spacing rhythm and baseline alignment are computed deterministically. AI explains the findings — it does not invent the numbers.

Learn more

Recommendations with values

Every note gives an exact fix: 56px → 72px, 1.4 → 1.25, 920px → 680px. Apply it, ignore it, or ask why.

Learn more

Hierarchy you can see

Detects levels that are too close, captions competing with body copy, too many weights and too many families.

Learn more

Optical, not just mathematical

Hanging punctuation, centred long text and other places where type aligns on paper but reads as misaligned on screen.

Learn more

Grid and baseline

Toggle a column grid and a 4/6/8px baseline over the canvas and see which line boxes break the vertical rhythm.

Learn more

Export the system

CSS, CSS variables, fluid clamp() sizes, Tailwind theme, design tokens or a written style guide — copied in one click.

Learn more

See what your typography is doing — and understand how to make it better.

Open the playground