Useful defaults
45-75
characters per line is still the fastest way to catch a layout drifting out of reading range.
Field guide for readable interfaces
Readable layouts start with a column that knows when to stop.
Column Width is an editorial toolkit for designers and developers who want text-heavy pages to feel quieter, clearer, and easier to stay inside.
Too loose Comfortable measure Too cramped
Reading block specimen
When the line runs long, the eye spends more effort relocating the next start point than it should.
A tuned measure settles the page. The text stops performing and starts reading.
32ch 58ch 84ch
Why this exists
Most websites ship typography by instinct, then wonder why the page never settles.
Editorial rhythm
3
layers matter most: measure, line-height, and spacing around text blocks.
Working artifact
1
interactive lab turns advice into something you can tune, copy, and share.
Flagship tool
Measure Lab turns typographic advice into a live calibration surface.
Tune width, size, and line-height. Watch the reading block tighten or loosen in real time. When it feels right, copy the CSS and keep moving.
Launch the lab
Working collection
Small enough to stay opinionated. Broad enough to become the default reference.
Guide
A practical baseline for line length, responsive typography, and when to break the rules.
PatternsPull quotes, sidenotes, captions, and text-heavy layouts tuned for calm reading rhythm.
Measure LabAdjust width, type size, and leading. Export a CSS snippet once the column feels right.
MethodologyScope, assumptions, and what this field guide deliberately refuses to oversimplify.
Symptoms
Three signs the reading width needs attention.
- Docs that feel denser than the information they hold.
- Landing pages with heroic type and unreadable body copy.
- Design systems that specify tokens but never define a comfortable measure.
Column Width