Orveta

WCAG Typography Readability Checker

Developer

Check if your text and background actually pass accessibility standards.

Typography settings

Choose your colors, font, size, and weight.

16px

Live preview

The quick brown fox jumps over the lazy dog. Readable text depends on real contrast, not just good intentions.

WCAG result

Evaluated as normal text

Contrast ratio17.06:1
WCAG AA

Passes · needs 4.5:1

WCAG AAA

Passes · needs 7:1

Normal text needs 4.5:1 for AA and 7:1 for AAA.

About this tool

Pick a text color, background color, font, size, and weight, and instantly see the real WCAG contrast ratio along with clear pass/fail results for both AA and AAA, at whichever text-size threshold actually applies to your settings.

How to use WCAG Typography Readability Checker

  1. 1

    Pick your text color and background color, either with the color picker or by typing a hex code.

  2. 2

    Choose a font family, size, and whether the text is bold.

  3. 3

    Read the live contrast ratio and see whether it passes WCAG AA and AAA.

  4. 4

    Adjust colors or size until both the look and the contrast ratio work for you.

Frequently asked questions