Back to Tools
Design & Color Tools
Color Contrast Checker
Check WCAG color contrast ratios for accessibility
Large Text Preview
Normal text preview — The quick brown fox jumps over the lazy dog.
0
Contrast Ratio
WCAG AA
Normal Text-
Large Text-
UI Components-
WCAG AAA
Normal Text-
Large Text-
WCAG requirements
- AA Normal — 4.5:1 minimum ratio
- AA Large — 3:1 minimum (18px+ or 14px+ bold)
- AAA Normal — 7:1 minimum ratio
- AAA Large — 4.5:1 minimum ratio
- UI Components — 3:1 minimum ratio
Want to learn more?
Read the complete guide with examples and tips
Related design tools
Continue with nearby tasks in the design & color tools hub.
Design
Color Converter
Convert colors between HEX, RGB, and HSL
Open tool
Design
Color Palette Generator
Generate harmonious color palettes from a base color
Open tool
Design
CSS Gradient Generator
Create CSS linear and radial gradients visually
Open tool
Design
CSS Box Shadow Generator
Design CSS box shadows with a visual editor
Open tool
Design
Border Radius Preview
Preview and generate CSS border-radius values
Open tool
Design
CSS Unit Converter
Convert between px, rem, em, vh, and vw
Open tool