Color Contrast Checker
Check WCAG 2.1 contrast ratios between text and background colors.
Contrast Ratio
21.00:1
Normal Text
AA (4.5:1)AAA (7:1)
Large Text
AA (3:1)AAA (4.5:1)
Preview Heading
The quick brown fox jumps over the lazy dog. This sample text helps you evaluate readability with your chosen color combination.
How to Use
- 1Enter or pick a foreground (text) color using the color picker or hex input.
- 2Enter or pick a background color.
- 3View the contrast ratio and WCAG AA/AAA pass/fail results instantly.
- 4Use the swap button to reverse foreground and background colors.
Key Features
- Real-time WCAG 2.1 contrast ratio calculation
- AA and AAA compliance check for normal and large text
- Hex color input and visual color pickers
- Live preview of text on background
- One-click color swap
- 100% browser-based — no data sent to servers