Color Contrast Checker

This tool measures the contrast ratio between two colours, a text colour and its background, and tells you whether it meets the WCAG accessibility standards that make text readable for everyone. Sufficient contrast is one of the most important and most overlooked parts of accessible, well-designed websites and documents. People with low vision, colour blindness, or simply those reading on a phone in bright sunlight, all depend on text standing out clearly from its background. The Web Content Accessibility Guidelines, or WCAG, set precise contrast requirements measured as a ratio, from 1 to 1 for identical colours up to 21 to 1 for black on white. The thresholds are 4.5 to 1 for normal text and 3 to 1 for large text at the AA level, and stricter 7 to 1 and 4.5 to 1 at the demanding AAA level. This tool calculates the ratio and checks it against all of these. You pick a foreground and a background colour, and the calculator works out the relative luminance of each, computes the contrast ratio between them, and shows whether the pair passes AA for normal and large text and AAA for normal text. The results update as you change either colour, so you can adjust until the combination passes. Use it to check that your text is readable, to choose accessible colour pairs for a website or document, or to fix a combination that fails. Meeting at least the AA level for normal text is the widely accepted minimum for accessible content. Good contrast helps every reader, not only those with impaired vision.

Calculate.co.nz is proud to be partnered with Premium Homes, a recognised leader in eco-friendly, sustainable, and energy-efficient homebuilding. With a dedicated team and award-winning experience, they create homes that prioritise health, comfort, and long-term performance. Their founders, Andrew and Kelly, set out to raise the standard of residential construction in New Zealand by combining practical building expertise with a clear commitment to doing things better for homeowners.
Calculate.co.nz partner: Premium Homes
Advertise on this page
9.74:1
contrast ratio
AA normal (4.5)Pass
AA large (3.0)Pass
AAA normal (7.0)Pass

WCAG contrast ratio. AA needs 4.5:1 for normal text and 3:1 for large text; AAA needs 7:1 and 4.5:1. Aim for at least AA normal for body text.

How it works

Each colour is converted to its relative luminance, a weighted measure of perceived brightness based on its red, green and blue components after a gamma correction. The contrast ratio is the lighter luminance plus 0.05, divided by the darker luminance plus 0.05. That ratio is then checked against the WCAG thresholds for AA and AAA.

Worked example

Black text on a white background gives the maximum contrast ratio of 21 to 1, comfortably passing every level. A medium grey like #444444 on white gives about 9.7 to 1, which still passes AA and AAA for normal text. A light grey on white, by contrast, can fall below 4.5 to 1 and fail.

Related calculators