Measure
行宽
Aliases:行宽行长每行字数一行多少字字符数每行measurecharacters per line
What is it
How many characters fit on one line — it decides whether the eye can return to the next line without effort. The comfort zone is roughly 45–75 Latin characters (28–40 CJK glyphs), with 65ch the usual target. Too narrow and the eye turns constantly; too wide and it loses the line. Control it with max-width in ch rather than guessing in pixels.
Interactive playground
Try it. Make an informed choice.Loading lab…
✓ When to use
- Long-form reading — articles, docs, help centre copy
- Containers grow with the viewport and body copy needs a hard cap
- Multi-column layouts where each column caps its own measure
✕ When not to use
- Tables and data grids — column structure dictates width
- Single-line fields and button labels — not paragraph text
- Fancy line-breaking tuning on top of a 65ch cap — diminishing returns
Variants
Optimal 65ch
舒适 65ch
The long-form default — easy on the return sweep
Narrow column
窄栏
Sidebars and pull quotes — around 45ch
Wide UI text
宽界面文字
Settings and form help — may stretch to 80ch
Implementation
max-width: 65chmax-width: 45remtext-wraphyphensCap body containers at max-width: 65ch (or about 36rem) inside a fluid shell so side margins breathe with the viewport. The ch unit tracks the current font's zero width and recalculates on font swap — steadier than pixels. For CJK, 28–40 glyphs is the target. Cap each column individually; never let whole-page width decide the measure.
Platform API
max-widthchtext-wraphyphensIn code
The exact names this thing goes by in each ecosystem — use the row that matches your project.
| Framework | Name |
|---|---|
| CSS | max-width: 65ch Line cap measured in zero-glyph width |
| Tailwind CSS | max-w-prose The ~65ch preset |
Compare
Full comparison →| Measure行宽 | Line Height行高 | Type Scale字号阶梯 | |
|---|---|---|---|
| Best for text | Long-form body and explanatory copy | Body paragraphs mainly; display tightens separately | Every heading and body level |
| Adjust granularity | Drag container width, measured in ch | Continuous — 0.05 is already perceptible | Steps by ratio — one level at a time |
| Responsive | High — max-width inside a fluid container | Medium — two steps across breakpoints | High — continuous with clamp() |
Related concepts
The vertical space one line of text occupies — it sets how tight or airy a paragraph feels. Display type tightens (1.1–1.3) to look built; body loosens (1.5–1.8) to support line-by-line reading; quotes can go looser still. Prefer unitless multiples so leading scales with font size instead of freezing in pixels.
FoundationUsed withA ratio-based set of font sizes that assigns heading and body levels a stable rhythm. Multiply a base body size by a fixed ratio (1.25 major third, 1.333 perfect fourth) to step upward, producing predictable contrast between headings instead of hand-picked pixels. Ship it as sm/md/lg tokens or fluid clamp() steps.
FoundationUsed withA visual language that lays out the page like a magazine spread: serif display headings, drop caps, hairline column rules, issue numbering and generous margins, with imagery woven into a page-turning rhythm. Black, white and grey grounds, serif-and-sans pairing — the layout tells the story, not ornament.
StylesUsed with