Colour contrast explained: AA, AAA and readability
Good contrast is what makes text readable at a glance, especially on small screens and in bright light. This guide explains the ratio and the levels.
What is the Color Contrast Checker?
This tool calculates the WCAG contrast ratio between a foreground and a background colour and rates it against the familiar AA and AAA levels. It is a readability guide, not a guarantee that every reader will find the pairing comfortable.
How to use it
- Enter the text colour and the background colour.
- Run the tool.
- Compare the ratio with the AA and AAA levels shown.
Worked example
Black on white gives the maximum ratio of 21.00:1, rated AAA.
What is a contrast ratio?
It compares how light two colours are, from 1:1 for identical colours up to 21:1 for black on white.
Frequently asked questions
What ratio do I need for normal text?
A ratio of 4.5:1 or higher meets AA for normal text.
Is a passing ratio enough on its own?
It is a strong guide, but font size, weight and real readers still matter.