100LinesOfCode
100LinesOfCode copied to clipboard
Add WCAG Contrast Checker Utility
Description
This PR adds a new utility: WCAG Contrast Checker.
It helps developers and designers ensure their color combinations meet accessibility standards (AA/AAA) based on official W3C formulas.
This project evolved from a simple color picker to a full accessibility tool, and finally to a Browser Extension (Manifest V3) with EyeDropper API support.
Linked Issue
Closes #443
Features
- [x] Real-time contrast ratio calculation (W3C relative luminance).
- [x] Dynamic preview box.
- [x] EyeDropper API integration (Pick color from screen).
- [x] Manual input support (HEX/RGB).
- [x] Logic kept under 100 lines of JS (96 lines).
- [x] Chrome Extension support (Manifest V3).
Tech Stack
- HTML5, CSS3 (Flexbox/Grid), Vanilla JavaScript.
Thank you!