CoolContrastWCAG contrast validation serving thousands of professionals
A community-validated contrast tool, recommended by Midudev, built to ensure compliance with chromatic accessibility standards.
See the site liveThe project
CoolContrast is an open-source tool built to help designers and developers create accessible interfaces by validating color contrast against WCAG guidelines. The project was born from the observation that while many tools can verify color contrast, few let users see how those colors perform within a real interface. To address this, CoolContrast features an interactive UI preview and automatically generates accessible color suggestions, making it easier to find compliant combinations without compromising visual aesthetics.
My contribution
I designed and developed the project end to end, from user research and UX design to the technical implementation and visual identity. The biggest challenge was turning a highly technical process into a simple and intuitive experience. To achieve this, I designed a workflow that lets users experiment with colors in real time, preview how they behave across real UI components, and receive intelligent recommendations that simplify decision-making throughout the interface design process.
The impact
Today, CoolContrast helps more than 3,000 users every month design more accessible interfaces. The project also gained significant visibility within the developer community after being shared by Midudev on X, reaching over 60,000 views. Beyond becoming a tool adopted by the community, the project reinforced my passion for building products where design, accessibility, and developer experience come together in a single, cohesive solution.
CoolContrast
Frontend Developer & Designer
React, Next, PandaCss, Typescript