Funnel & CRO
Grade font size, line height and line length against legibility best practice.
- Category
- Funnel & CRO
- Signup
- None
- Your data
- Stays in your browser
- Also in
- Claude, via MCP
What font size, line height and line length make body text readable?
This tool scores body text against three ranges: font size 16 to 20 px, line height 1.4 to 1.7 and line length 50 to 75 characters. Each scores full marks inside its range and less the further outside it falls; size and line length carry 35% of the score each, line height 30%. 16 px, 1.5 and 68 characters score 100.
Comfortable to read, size, rhythm and measure all sit in the sweet spot. Long-form copy will hold attention, which is exactly what you need on pages that sell with words.
Guidance for body copy, not display headings. On mobile, favour 16px+ and shorter measures; the line-length ideal is about the reading column, not the viewport.
About this calculator
Long-form copy that sells, product pages, blog posts, sales letters, lives or dies on whether people can actually read it without fatigue. This grader scores three typography fundamentals against the ranges typography research consistently points to as ideal: font size, line height (leading), and line length (measure), and tells you which one is dragging your legibility down.
How to use it
- Enter your body font size in pixels.
- Enter your line height as a multiplier of font size (1.5 means 1.5× the font size).
- Enter your line length in characters per line, roughly how wide your text column reads.
- Read the overall legibility score plus each factor's individual match against its ideal range, and the single weakest factor to fix first.
Methodology
Each input is scored against an ideal band using a band-scoring function: full marks (100%) if the value falls inside the band, decaying linearly toward zero as it moves outside, at a rate set by a tolerance value. Font size targets 16-20px (tolerance 8), line height targets 1.4-1.7 (tolerance 0.5), and line length targets 50-75 characters (tolerance 30).
The three band scores are weighted 35% font size, 30% line height, 35% line length, and summed into a 0-100 legibility score. The lowest-scoring factor is surfaced as the specific fix to prioritise, with directional guidance (e.g., "cap line length near 65-75 characters" if you're over, "widen the measure" if under).
These bands describe desktop body copy conventions specifically. Mobile reading generally favours the same or larger font sizes with a shorter measure, since the viewport itself constrains line length; the tool's guidance is a starting point, not a strict cross-device rule.
Legibility score from three ranges
Range score = 1 inside the range, otherwise max(0, 1 − distance outside ÷ tolerance) Font size: 16 to 20 px, tolerance 8 Line height: 1.4 to 1.7, tolerance 0.5 Line length: 50 to 75 characters, tolerance 30 Score = 35% × Size + 30% × Line height + 35% × Line length
- Font size
- Body text size in CSS pixels.
- Line height
- Space between lines as a multiple of font size.
- Line length
- Average characters per line, including spaces, at a typical desktop width.
The ranges describe desktop body text conventions, not rules for headings. On mobile, the screen limits line length, so focus on font size and line height. WCAG's Level AAA visual presentation guidance for blocks of text also suggests lines no longer than 80 characters and line spacing of at least 1.5 within paragraphs, which fits the tool's ranges.
Worked example: 14 px text at 95 characters a line
A blog uses 14 px body text with a line height of 1.3, and on a wide screen lines run to about 95 characters.
- Font size: 14 is 2 below 16; score = 1 − 2 ÷ 8 = 0.75.
- Line height: 1.3 is 0.1 below 1.4; score = 1 − 0.1 ÷ 0.5 = 0.8.
- Line length: 95 is 20 above 75; score = 1 − 20 ÷ 30 = 0.33.
- Score = 35% × 0.75 + 30% × 0.8 + 35% × 0.33 = 26.3 + 24 + 11.7 = 62.
- Setting 17 px text, 1.6 line height and a maximum width that gives about 68 characters scores 100.
Line length is the biggest problem here: very long lines make it hard to find the start of the next line. A maximum content width fixes it without changing the design elsewhere. Then check the page's buttons with the CTA visual hierarchy tester.
What makes body text easy to read?
Comfortable reading comes from a few settings working together:
- Size: at least 16 px for body text on screens.
- Line height: around 1.5 for paragraphs.
- Line length: roughly 50 to 75 characters, set with a maximum width on the text column.
- Contrast: dark text on a light background, or the reverse, with enough contrast; see WCAG.
- Paragraph spacing: clear space between paragraphs.
Longer lines need more line height; shorter lines can use less.
Typography for Indian and US audiences
Many Indian visitors read on smaller phones and in a second language, so slightly larger text and generous line height help. If the site uses Devanagari or other Indian scripts, test those scripts separately: they usually need more line height than Latin text, because of marks above and below the line.
US accessibility expectations make WCAG text guidance a common reference for public-facing sites. Users can zoom text, so layouts should not break when text is enlarged. For overall page clarity, see the above-the-fold messaging clarity grader.
Common typography mistakes
- Body text smaller than 16 px.
- Full-width text on large screens with very long lines.
- Tight line height in long paragraphs.
- Light grey text with weak contrast.
- Testing only on the designer's screen.
Sources
- Web Content Accessibility Guidelines (WCAG) 2.1: Visual Presentation, W3C. Accessed 2026-10-19.
FAQ
Below 16px, body text starts requiring visible effort to read on typical screens, particularly on mobile, and it's also the size below which browsers may auto-zoom on input focus. 16-20px is the range most legibility research and style guides converge on for comfortable long-form reading.
Lines that run too long (over ~75 characters) force the eye to work harder to track back to the start of the next line, increasing reading fatigue even if the font size and spacing are otherwise fine. Lines that are too short cause the eye to jump lines too frequently, which has the opposite but related effect.
No, the bands here are calibrated for body copy meant to be read continuously. Headings and short display text follow different legibility rules since they're typically scanned rather than read line by line.
Around 1.5 times the font size suits most body text. Longer lines need a little more; short lines in narrow columns can use a little less.
Set a maximum width on the text column, for example in characters (such as 65ch) or pixels, so lines stay readable on wide screens.
Numbers looking off?
If the model says one thing and the pipeline says another, that gap is usually where the revenue is. A 30-minute call finds it.
It starts with a 30-minute call. Pick a time below.