This tool is inspired by USWDS, to help you create color combinations that meet accessibility standards.
System assigns each color a grade from 0 (white) to 100 (black).
The "magic number" is simply the difference between the grades of two colors.
Accessibility levels:
- 40+: Meets WCAG 2.2 AA for large text (3+)
- 50+: Meets WCAG 2.2 AA for standard text and AAA for large text (4.5+)
- 70+: Meets WCAG 2.2 AAA for standard text (7+)
Grade | Color | Hex code | Luminance | Target range |
---|