Typographic Measure
Density
Density is the texture of text on screen. Too tight and the eye cannot breathe. Too loose and the rhythm dissolves. Font size, line-height, and measure are three variables — but they are not independent. Change one and the other two shift in meaning. This tool shows you the shift.
Typographic Density
Set the parameters. See the texture. Compare two configurations side-by-side. Characters per line, lines per column, density score — live.
The Three Variables
Font Size
Sets the voice. 16px is the browser default and the screen-reading floor. Below 14px, body text becomes a strain. Above 20px, you are editorializing. The right size depends on measure — wide columns need larger type to maintain character density.
Line Height
Sets the pace. Leading below 1.4 packs lines so close that the eye loses its place on the return sweep. Above 1.8, lines float apart and the paragraph loses cohesion. Body text lives at 1.5–1.6. Headings can go tighter: 1.1–1.2.
Measure
Sets the horizon. 45–75 characters per line is the readable range. Below 45, the eye breaks too often. Above 75, the return sweep loses its anchor. Full-width text on a wide monitor is 120+ characters — that is not a paragraph, it is a wall.
Readability vs. Efficiency
Dashboard designers want density. Editorial designers want air. Both are right — for their context. The tension is real: a data-heavy table at generous spacing wastes screen estate. A long-form article at dashboard density exhausts the reader in three paragraphs.
The density score in the tool is not a grade. It is a position on a spectrum. A score of 70 is not "too dense" in absolute terms — it is too dense for body copy and exactly right for a compact data grid. Context determines whether density is structure or clutter.
When Space Is Structure
Whitespace between paragraphs signals a shift in thought. Whitespace between a heading and its body signals ownership. Whitespace between sections signals a chapter break. Remove any of these and the reader's mental model collapses — the hierarchy flattens into a stream.
But whitespace can also be waste. A landing page with 200px of padding between every section is not breathing — it is stalling. The compare mode above makes this visible: set Panel A to generous spacing and Panel B to compact. Same content, radically different density. Neither is wrong. But one matches your reader's intent.