Colour Contrast Checker
Colour contrast is a very important component of creating a more accessible web for all users. To make your text easy to read, the contrast between the text and the background should be high.
Use this colour contrast checker to determine whether or not your colour combinations are accessible or not.
Text colour
Background colour
Result — Ratio:
AA+
Normal text
AAA+
Normal text
AA+
Large text
AAA+
Large text
Colour Contrast Checker
The tool uses the WCAG 2.0 (the world’s authority on web accessibility) formula for colour contrast. For level AA compliance, your text should have a contrast ratio of 4.5:1 (don’t worry, our tool will figure this out for you!). For level AAA compliance your text should have a contrast ration of 7:1—however, if your text is large (18+ point or 14 points if the text is bold), then your ratio can be 3:1 for AA compliance and 4.5:1 for AAA.