🎨

Color Contrast Checker

Check WCAG color contrast ratios

Check WCAG color contrast ratios for accessibility

Foreground Color

Background Color

This is normal text at 18px

This is small text at 14px

Contrast Ratio

21:1

Normal Text (18px+):✓ Pass

Large Text (24px+):✓ Pass

Normal Text (18px+):✓ Pass

Large Text (24px+):✓ Pass

AA Normal Text: 4.5:1 minimum contrast

AA Large Text: 3:1 minimum contrast (18px+ or 14px+ bold)

AAA Normal Text: 7:1 minimum contrast

AAA Large Text: 4.5:1 minimum contrast

Related Tools

Minify and beautify CSS code

Test and debug regular expressions

Minify and beautify JavaScript code

Generate CSS box-shadow with visual controls

Create custom border radius with visual controls

Quick reference for HTTP status codes