Theme Color Contrast Checker
Understanding Contrast Ratings
- 7.0+ AAA Excellent contrast, exceeds WCAG AAA (7:1)
- 4.5+ AA Good contrast, meets WCAG AA for normal text (4.5:1)
- 3.0+ AA Large Fair contrast, meets WCAG AA for large text only (3:1)
- Fail Poor contrast, doesn't meet minimum WCAG requirements
Accent Colors as Text
Testing theme accent colors as text on their respective light/dark backgrounds.
Primary Light on Light BG
Primary Light on Light Section
Secondary Light on Light BG
Secondary Light on Light Section
Primary Dark on Dark BG
Primary Dark on Dark Section
Secondary Dark on Dark BG
Secondary Dark on Dark Section
Accent Colors as Background (e.g., for Buttons)
Testing accent colors as backgrounds according to the project-specific design rules.
White Text on Primary Light
White Text on Secondary Light
Black Text on Primary Dark
Black Text on Secondary Dark