Color Converter and Contrast Checker

About the Color Converter and Contrast Checker

The Color Converter and Contrast Checker shows a foreground and a background color in HEX and RGB and calculates their contrast ratio. It then tells you whether the pair passes the WCAG AA accessibility thresholds: 4.5:1 for normal text and 3:1 for large text.

Everything runs in your browser with JavaScript. Nothing you type is uploaded to our server, so it is safe to use with private data.

How to use it

1. Pick the text (foreground) color.
2. Pick the background color.
3. Select Convert and check.
4. Adjust the colors until both checks pass.

Common uses

• Making sure website text is readable for people with low vision.
• Converting colors between design and code formats.
• Checking brand colors before using them for text.

Tips

• Large text means at least 24 px regular or about 19 px bold.
• Passing contrast is a minimum; also avoid relying on color alone to carry meaning.