Test foreground and background color combinations against WCAG AA and AAA accessibility standards.
Large Text (24px)
Bold Large Text (18px bold)
Normal body text at 16px. This is how your regular paragraph content would appear with the selected color combination.
Small text at 12px for captions or footnotes.
Pick a foreground (text) color and a background color using the color pickers or by entering hex values directly. The tool instantly calculates the contrast ratio and shows whether your combination passes WCAG AA and AAA standards for both normal and large text. Use the swap button to quickly reverse the colors and test readability both ways.
The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios to ensure text is readable by people with visual impairments. AA level requires 4.5:1 for normal text and 3:1 for large text (18px bold or 24px regular). AAA level requires 7:1 for normal text and 4.5:1 for large text. Meeting at least AA is widely considered the baseline for accessible web design.
Need to convert color formats? Use our Hex to RGB Converter. Looking for color inspiration? Try the Color Picker.