Project: WCAG Contrast Checker · Status: Prototype · Date: January 2026
WCAG Contrast Checker
Accessibility tool for analyzing color contrast ratios against WCAG AA and AAA standards.
What it does
The WCAG Contrast Checker helps designers and developers verify that their color combinations meet accessibility requirements. It calculates contrast ratios between foreground and background colors and checks compliance against both WCAG AA (4.5:1 for normal text) and AAA (7:1 for normal text) levels.
Features
Three input modes:
- Upload a CSV file with color definitions (name, background hex, foreground hex)
- Add colors manually via the UI
- Load sample data with Danish municipal color palettes (Aarhus, Aalborg, Viborg, etc.)
Contrast analysis:
- Real-time contrast ratio calculation
- WCAG AA and AAA compliance indicators
- Visual preview of each color combination
Brightness adjustment:
- Expandable detail rows with brightness sliders
- Test variations of each color to find compliant alternatives
- See how small adjustments affect compliance
Export:
- Download results as CSV for documentation
Interactive prototype
Try loading the sample data to see Danish municipal color palettes analyzed against WCAG standards.