Choose two colors
Enter the foreground and background colors you plan to use together in your interface or visual design.
Accessibility testing
WCAG Contrast Checker
Check whether foreground and background colors have enough contrast for readable text and accessible interfaces. Chromble calculates the ratio and shows the relevant WCAG results immediately.
Check color contrastRead the contrast ratio
Chromble calculates the luminance contrast between the colors and displays the resulting ratio.
Check AA and AAA
Use the pass and fail results as a practical accessibility check for normal and large text before shipping the design.
Quick answers
Frequently asked questions
What is a WCAG contrast checker?
A WCAG contrast checker compares foreground and background colors and calculates their contrast ratio so you can evaluate common accessibility thresholds.
What contrast ratio should normal text have?
WCAG AA commonly uses a 4.5:1 minimum for normal text and 3:1 for large text. Higher contrast may be required for stricter AAA targets.
Can I test custom HEX colors?
Yes. Enter your foreground and background colors in Chromble Contrast Checker to see the ratio and pass or fail status immediately.