← All tools

Color Contrast Checker

Check WCAG contrast, auto-fix failing pairs and simulate color blindness.

Contrast ratio
FG luminance BG luminance
Aa — sample text

Color blindness simulator

Approximate views computed with standard simulation matrices.

Protanopiared-blind
Aa
Deuteranopiagreen-blind
Aa
Tritanopiablue-blind
Aa

Similar Tools

Color Picker & Palette

HEX, RGB & HSL palettes.

Percentage Calculator

Percentages, ratios & change.

Smart Text Analyzer

Count words, chars & case.

Built with privacy in mind. All processing happens entirely in your browser using open-source libraries.

What is the Color Contrast Checker?

WCAG contrast is the measured difference in luminance between text and its background. This checker computes the ratio, evaluates it against WCAG AA and AAA thresholds for normal and large text, and shows you exactly where your color pair stands.

Accessible design is not optional. When a pair fails, the auto-fix button adjusts the foreground color to reach a passing ratio, and the color-blindness simulator previews how your colors look to people with protanopia, deuteranopia and tritanopia.

How to use the Color Contrast Checker?

  1. Enter a foreground and a background hex color.
  2. Read the ratio and the AA/AAA pass/fail badges.
  3. Click Auto-fix to fix failing pairs, and toggle the simulator to preview color-blind views.

Frequently Asked Questions (FAQ)

Is the Color Contrast Checker free?

Yes, free with no signup or limits.

What does auto-fix do?

It adjusts the foreground color toward a passing WCAG ratio without changing the hue family more than necessary.

Does it run offline?

Yes, all calculations happen locally in your browser.