Skip to content
Toolbox
en Choose a language

WCAG color contrast checker

Make sure everyone can read your text. Enter a text and a background color to see the contrast ratio and whether it meets the WCAG requirements.

Runs in your browser. Nothing is uploaded.

Loading the contrast checker…

How to use the contrast checker

  1. Enter the text color and the background color, or use the color pickers.

  2. Read the contrast ratio and the AA and AAA results.

  3. Adjust the colors until the combination passes.

Frequently asked questions

What contrast does WCAG AA require?

At least 4.5:1 for normal text, and 3:1 for large text (24 pixels, or 18.66 pixels bold) and for parts of the user interface such as borders of form fields.

What does AAA require?

At least 7:1 for normal text and 4.5:1 for large text.

Related tools

  • Color converter

    Convert colors between HEX, RGB and HSL, with a color picker and a live preview. Supports shorthand HEX and transparency.

  • Color namer

    Find the name of any color code. See the closest color names from the NTC, HTML, X11, Pantone and ROYGBIV lists with their distance.

  • CSS unit converter New

    Convert CSS units: px to rem, em, pt, pc, cm, mm and inches and back, with an adjustable root font size.

All tools in Color