Colour contrast checker

The WCAG 2.x contrast ratio (relative luminance, 1:1 to 21:1) as used by success criteria 1.4.3, 1.4.6 and 1.4.11 of WCAG 2.2. Normal text needs 4.5:1 for AA and 7:1 for AAA; large text (24px or more, or 18.66px bold) needs 3:1 for AA and 4.5:1 for AAA; UI components and graphics need 3:1. The ratio is shown truncated to two decimals, so 4.50 always means at least 4.5. APCA, the candidate model for WCAG 3, is a different measure and is not calculated here.

No. The ratio is defined for opaque colours, and the tool refuses a colour with transparency instead of guessing. Enter the colour as it actually appears on the page, for example the composited result of a semi-transparent overlay.

An rgb() channel above 255 or below 0, or an hsl() percentage outside 0 to 100, is clamped to the nearest valid value, as browsers do, and the field tells you which colour was actually checked. Keywords such as currentcolor have no fixed value and are refused with an explanation, and transparent is refused as a fully transparent colour.

The suggestion keeps the hue and the colourfulness (chroma) of your colour in the perceptual OKLCH space and moves only its lightness, in half-percent steps, until the pair reaches the required ratio; the smaller move of darker or lighter wins, and chroma is reduced only where the sRGB gamut forces it. Both the text and the background are offered. Nothing changes until you press Use. If no lightness of that hue can reach the ratio (for example 7:1 against a mid grey), the tool says so.

Not on this page: it checks one text colour against one background colour and does not sample images. For a tonal scale and harmonies built around one colour, use the Colour palette generator from the same family; it is linked as the next step below.

No. The page loads a small script into your browser and every calculation runs on your device. You can check this yourself in the browser's network panel: after the page has loaded there are no upload requests. Closing the tab discards what you entered.

No. These basic tools are free, have no limits set by us and store nothing on our servers.

Nothing you open or type. While the tab is open, the tool pages keep a short list of the steps taken in it, in the tab's session storage: the step (page opened, started, succeeded, first success, used again or failed), the tool's name, the time, how many files were used and, for a failure, an error code; never a file name, the contents of a file or your text. It holds at most the latest 200 steps, and the browser deletes it when the tab closes. The page never sends it. Where a Report a problem button is shown, you can attach the last 20 steps to your report; nothing is attached unless you tick that box. In local storage the page keeps only choices you made: a Light or Dark theme until you choose System again, the language you picked with the EN / 中文 switch if it differs from your browser's language, and this tool in your recently used list if you switched that list on at the tools page.