How Color Match calculates results
Updated September 14, 2026
WCAG contrast: a specific text check
We decode each 8-bit sRGB channel, calculate relative luminance with the 0.2126 / 0.7152 / 0.0722 weights, then divide (lighter luminance + 0.05) by (darker luminance + 0.05). Pass/fail uses the unrounded value. Normal text needs 4.5:1 for AA and 7:1 for AAA; large text needs 3:1 and 4.5:1 respectively.
Large text means at least 18pt (24 CSS px), or at least 14pt (about 18.67 CSS px) and bold. This calculation does not certify an entire page or website. Transparent text must first be composited against its real background; our checker currently accepts opaque sRGB colors.
W3C: Understanding Contrast (Minimum)APCA: a supplementary measurement
Our implementation follows the published APCA 0.0.98G sRGB math, including the 2.4 power transform and one low-luminance clamp. Lc is signed: positive for dark text on a light background and negative for the reverse. Its text recommendations depend on typography. We do not use Lc as a substitute for the WCAG 2.2 pass/fail check.
APCA author documentation and reference implementationReference examples
| Text / background | WCAG ratio | APCA Lc |
|---|---|---|
| #000000 / #FFFFFF | 21.000000:1 | 106.0407 |
| #FFFFFF / #000000 | 21.000000:1 | -107.8847 |
| #777777 / #FFFFFF | 4.478089:1 | 71.1111 |
Perceptual color difference: CIEDE2000
Our comparison tool decodes opaque sRGB, converts it to XYZ, adapts D65 to D50 with the Bradford matrix, and calculates CIE Lab for the CIE 1931 2° observer. CIEDE2000 uses kL = kC = kH = 1. Both colors use the same conversion. The method version is ciede2000-srgb-d50-v1.
A lower ΔE00 indicates a smaller calculated perceptual difference. It is not a similarity percentage, a universal visibility threshold, or a text-readability measurement. In particular, an accessible replacement can look different from the original even when its text contrast passes.
Suggested fixes and gamut limits
The contrast fixer searches lighter and darker OKLCH values against a fixed background, then rechecks the resulting rounded sRGB color. Conversion may clip out-of-gamut values, which can alter hue or chroma. The tool reports when the chosen target cannot be reached. A suggested fix still needs review in your actual interface.
The selected result is near the original among the candidates inspected, not a proven global minimum over every possible color. Reports show the original and adjusted foreground, their raw contrast ratios, the declared target, and their ΔE00 difference.
Reference data and reusable reports
The public validation set contains 28 independently computed contrast references, six attributed CIEDE2000 reference pairs and six labelled correction invariants. The difference references check the formula; conversion is separately tested against W3C sample-code results. Stored expectations are compared during the build. A verified check is not a certification of the entire site.
Download JSON or CSV evidence, or copy a Markdown/HTML report from the contrast and link tools. Reports retain raw ratios, calculation versions and exact input URLs without acquisition tags. A link-to-body distinction check is labelled separately from a text-on-background check.
Conversion and naming limits
HEX, RGB, HSL and HSV describe the same screen color through different coordinates. OKLCH values are derived from sRGB through Oklab. CMYK values are a mathematical approximation without an ICC print profile, not a print-proof guarantee. Color names are selected from our reference list by RGB distance; perceptually similar colors can have different descriptive names.
CSS Color Level 4Found a mismatch? Send the inputs and expected result.