Color Contrast Checker
Check WCAG contrast ratio between foreground and background colors with AA/AAA pass/fail results.
How to Use Color Contrast Checker
The Color Contrast Checker is a free online tool that calculates the WCAG contrast ratio between any two colors and tells you whether they pass accessibility standards. Enter foreground and background colors (hex) and see the contrast ratio along with pass/fail results for WCAG AA and AAA levels for both normal and large text. A live preview shows how text looks with your chosen colors. Whether you are designing accessible websites, checking brand colors for compliance, auditing existing designs for WCAG conformance, or learning about web accessibility requirements, this tool provides instant actionable feedback.
Step-by-Step Instructions
- Enter the foreground (text) color in hex format
- Enter the background color in hex format
- Click check to see the contrast ratio and WCAG results
- Review AA/AAA pass/fail for normal and large text sizes
Related Tools
Color Picker
Pick colors and get HEX, RGB, and HSL values simultaneously.
Gradient Generator
Create CSS linear and radial gradients with live preview.
Palette Generator
Generate 5 complementary colors from any base color.
Image to Base64 Converter
Convert PNG, JPEG, GIF, WEBP, and SVG images to Base64 strings.