ACCESSIBILITY VALIDATION
Contrast Checker
Verify compliance with WCAG 2.2 AA and AAA standards using exact sRGB relative luminance mathematical calculations.
21:1
Contrast Ratio
Normal Body Text
AA (4.5:1)AAA (7.0:1)
Regular copy under 18pt (24px)
Large Headings
AA (3.0:1)AAA (4.5:1)
Bold 14pt+ or regular 18pt+
UI & Graphical Elements
WCAG 2.1 (3.0:1)
Borders, icons, input frames, charts
Interactive UI Component Preview
Designing for Accessible Clarity
Ensuring accessible contrast ensures readers can quickly absorb typography across all lighting conditions, displays, and visual capabilities.
Form Input Component
Palette Contrast Matrix
Evaluates all pairwise combinations within your current palette
Recommended text on #FFFFFF: #000000
| Pairs | #000000 | #FFFFFF | #FF6B6B | #118AB2 | #F4ECD6 |
|---|---|---|---|---|---|
| #000000 | - | 21:1 | 7.57:1 | 5.3:1 | 17.82:1 |
| #FFFFFF | 21:1 | - | 2.78:1 | 3.96:1 | 1.18:1 |
| #FF6B6B | 7.57:1 | 2.78:1 | - | 1.43:1 | 2.35:1 |
| #118AB2 | 5.3:1 | 3.96:1 | 1.43:1 | - | 3.36:1 |
| #F4ECD6 | 17.82:1 | 1.18:1 | 2.35:1 | 3.36:1 | - |