How it works
Each sRGB channel is linearized, combined into relative luminance and compared with (Llighter + 0.05) / (Ldarker + 0.05).
Design / HXD Labs
Color contrast checker
Check two hex colors before using them for text or interface components.
Result
Fill in the fields to see the result.
How to use
The ratio uses WCAG relative luminance. Check AA and AAA criteria, preview sample text in the selected colors and copy a report. Thresholds depend on text size; this does not replace a complete accessibility review.
Example
Black on white has a 21:1 contrast ratio; nearby gray shades may fall below 4.5:1 for normal text.
Good to know
WCAG AA calls for 4.5:1 for normal text and 3:1 for large text and relevant non-text components. Font weight and context also matter.