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.

Siteimprove Toolkit. This collection of free tools will help you perfect your digital presence today.