Color Contrast Ratio Checker
Check WCAG 2.2 AA and AAA text contrast for two solid HEX colors.
Try a worked example
Try a worked example
Check WCAG 2.2 AA and AAA text contrast for two solid HEX colors.
Check the units and options, then use the tool’s calculation button. The example is fictitious; replace its values for your own calculation.
Example input
- Text color
- #000000
- Background color
- #ffffff
Expected output
Contrast ratio: 21.000000:1 WCAG 2.2 AA — normal text (4.5:1): Pass WCAG 2.2 AA — large text (3:1): Pass WCAG 2.2 AAA — normal text (7:1): Pass WCAG 2.2 AAA — large text (4.5:1): Pass Pass/fail uses the full ratio; the displayed ratio is rounded.
Compare two opaque HEX colors and report WCAG 2.2 AA and AAA thresholds for normal and large text.
Waiting for the tool. The explanation remains available without JavaScript.
Method and limits
Enter the text (foreground) and background colors as opaque 3- or 6-digit HEX values. The result checks WCAG 2.2 AA and AAA thresholds for normal text and large text (at least 18 pt regular or 14 pt bold, roughly 24 px or 18.7 px). The pass/fail checks use the full ratio, not its rounded display value.
Large text means at least 18 pt regular or 14 pt bold. This check does not assess UI components, images, gradients, or overall page conformance.
Share this tool
Only the tool’s public link is shared. Your inputs and results stay here.
Show link to copy manually
Quick answer
Compare two opaque HEX colors and report WCAG 2.2 AA and AAA thresholds for normal and large text.
The page and its assets load from the site; this operation uses your entered values only in this browser and does not send them to a calculation endpoint.
How to use it
Enter the text (foreground) and background colors as opaque 3- or 6-digit HEX values. The result checks WCAG 2.2 AA and AAA thresholds for normal text and large text (at least 18 pt regular or 14 pt bold, roughly 24 px or 18.7 px). The pass/fail checks use the full ratio, not its rounded display value.
Limits
Large text means at least 18 pt regular or 14 pt bold. This check does not assess UI components, images, gradients, or overall page conformance.
Frequently asked questions
What counts as large text?
WCAG treats text at least 18 pt regular or 14 pt bold as large (about 24 px or 18.7 px). Thin or unusual fonts may need more contrast.
Does a pass mean my page is accessible?
No. This checks text contrast for two opaque solid HEX colors. It does not check non-text controls, images, gradients, font styling, or other accessibility requirements.
Sources and references
- W3C: WCAG 2.2, Contrast (Minimum)
- W3C: WCAG 2.2, Contrast (Enhanced)
- W3C: Understanding SC 1.4.3 Contrast (Minimum)
These references document the cited standard or browser API; they do not validate the tool’s output.