Home
/
Apps
/
Text Spacing Accessibility Calculator
Text Spacing Accessibility Calculator

Text Spacing Accessibility Calculator

Check whether your line height, letter spacing, word spacing, and paragraph spacing meet WCAG 2.1 Success Criterion 1.4.12 minimums for accessible text.

Check whether your line height, letter spacing, word spacing, and paragraph spacing meet WCAG 2.1 Success Criterion 1.4.12 minimums for accessible text.

Share this app

Text Spacing Accessibility Calculator

What this calculator does

Checks whether your CSS text spacing — line height, letter spacing, word spacing, and paragraph spacing — meets the minimums defined by WCAG 2.1 Success Criterion 1.4.12 (Text Spacing, Level AA). This criterion exists because many users with low vision or reading/cognitive disabilities rely on browser extensions or user stylesheets to override a site's text spacing to make content easier to read. A site conforms to 1.4.12 only if no content or functionality is lost when a user applies these more generous spacing values — which in practice means the site's own default spacing should already be at or above these minimums, or at least not break when they're increased.

The four minimums

All four minimums are expressed as a multiple of the element's own font size:

line height1.5×font size\text{line height} \geq 1.5 \times \text{font size} letter spacing0.12×font size\text{letter spacing} \geq 0.12 \times \text{font size} word spacing0.16×font size\text{word spacing} \geq 0.16 \times \text{font size} spacing following paragraphs2×font size\text{spacing following paragraphs} \geq 2 \times \text{font size}

How to use it

  1. Enter your element's font size in pixels.
  2. Enter the line height, letter spacing, word spacing, and paragraph spacing (the space below a paragraph, e.g. margin-bottom) you're currently using, also in pixels.
  3. Submit to see a pass/fail checklist and a table comparing your values against the minimum required for your font size.

Example

A paragraph styled with font-size: 16px, line-height: 22px, letter-spacing: 0px, word-spacing: 0px, and margin-bottom: 24px:

required line height=1.5×16=24px22px fails\text{required line height} = 1.5 \times 16 = 24\text{px} \Rightarrow 22\text{px fails} required letter spacing=0.12×16=1.92px0px fails\text{required letter spacing} = 0.12 \times 16 = 1.92\text{px} \Rightarrow 0\text{px fails} required word spacing=0.16×16=2.56px0px fails\text{required word spacing} = 0.16 \times 16 = 2.56\text{px} \Rightarrow 0\text{px fails} required paragraph spacing=2×16=32px24px fails\text{required paragraph spacing} = 2 \times 16 = 32\text{px} \Rightarrow 24\text{px fails}

This paragraph would need a taller line height, added letter/word spacing, and more space below it to conform to 1.4.12.

Why it matters

WCAG 1.4.12 is a Level AA criterion, meaning most accessibility conformance targets (including the widely-referenced WCAG 2.1 AA baseline) require it. Beyond compliance, generous text spacing genuinely helps readers with dyslexia, low vision, and certain cognitive disabilities track lines of text and distinguish individual words — while rarely hurting readability for anyone else.