Color Contrast Checker
Check the contrast ratio between a text color and background color.
Sample text
How to Use the Color Contrast Checker
Choose foreground and background colors to calculate their contrast ratio and compare it with common WCAG readability thresholds.
Practical Example
Black text on a white background has a 21:1 contrast ratio, the maximum contrast for standard sRGB colors.
Factors That Affect the Result
Text size, font weight, foreground color, background color and the WCAG criterion being evaluated determine whether a combination passes.
Frequently Asked Questions
What is contrast ratio?
It measures the relative luminance difference between two colors.
Is higher contrast always better?
Higher contrast generally improves legibility, although design context still matters.
Does this replace accessibility testing?
No, contrast is only one part of a complete accessibility review.