Contrast Checker
The contrast ratio between two colours and whether it passes WCAG, seen on a live sample.
Result
Body text at its usual size, which is what most of a page is made of.
Large text, from about 24px
- Body text, AA (4.5:1)
- Body text, AAA (7:1)
- Large text, AA (3:1)
- Large text, AAA (4.5:1)
Good to know
- Large text means roughly 24px, or 19px when it is bold. That is why it has its own thresholds: bigger shapes stay legible at a contrast that would fail for body text.
- The ratio runs from 1:1 for two identical colours to 21:1 for black on white, and it is symmetric — swapping text and background never changes it.
- The figure is computed on linear light rather than on the stored channel values, which is why a colour that looks midway between black and white scores nowhere near 10:1.
- Passing the ratio is a floor, not a finish line. Thin weights and small sizes can still be hard to read at exactly 4.5:1.
29 views