WCAG AA Text Size

Recommended text size (WCAG AA)

Body text on the web should start at 16 CSS px (~12 pt), which happens to be the default font-size: 1rem that every major browser ships. WCAG 2.1 SC 1.4.4 Resize Text says text has to scale up to 200% without losing content, and SC 1.4.12 Text Spacing backs that up by pushing for layouts that bend. On contrast, SC 1.4.3 Contrast (Minimum) wants a 4.5:1 ratio for normal text and 3:1 for large text. Large here means ≥ 18 pt regular or ≥ 14 pt bold (~24 px / 18.66 px).

To convert in practice, use px = pt × (96/72), which gives 12 pt ≈ 16 px and 14 pt ≈ 18.67 px. Watch out on mobile: if you declare an input under 16 px, iOS zooms into the field the moment it gets focus. Setting font-size: 16px or larger on input, textarea and select stops that viewport jump. For SC 1.4.12, keep line height at 1.5× the font size and paragraph spacing at 2×.

Applications

Use the calculator to scale typography across design systems, e-commerce, news sites, government portals and educational platforms. The frameworks it maps to are WCAG 2.1/2.2, Brazil's eMAG 3.1, ABNT NBR 17060 (acessível para todos), Section 508 and EN 301 549.

FAQ

Can I use 14 px on the body? Not as your default size. People would end up zooming every page, which goes against what 1.4.4 is after. Save 14 px for captions or legal fine print.

Are rem units better than px? They usually are, because rem honours whatever font size the user picked in their browser. Set one root size on html and let everything else scale off it.

What about WCAG AAA? SC 1.4.6 pushes contrast up to 7:1 for normal text and 4.5:1 for large. The recommended baseline size, though, is still 16 px.