🎨 Contrast Checker
A simple, accessible tool for comparing two colors according to WCAG accessibility standards. Built with React (Vite) and styled with Tailwind CSS, this app helps designers and developers ensure their color combinations meet accessibility requirements for readability and usability.
Features
Checks contrast ratio and compliance against WCAG 2.1 (AA and AAA levels)
Input via:
HEX codes
HSL sliders
Native color pickers
Integrated Tailwind default color palette for quick access
Swap foreground and background colors with one click
Real-time evaluation and feedback
How it Works
The app calculates the relative luminance of each input color and then uses the WCAG contrast formula to determine if the pair meets accessibility standards for:
Tech Stack
React (via Vite)
Tailwind CSS
TypeScript
Future Improvements
A more polished and visually engaging UI
Theme presets and color history
Suggestions for accessible alternatives
Support for alpha/transparency
