A macOS app for quick access to WCAG color contrast ratios

#3 Product of the DayJuly 17, 2017

Contrast is a macOS app for designers and developers that provides quick access to WCAG color contrast ratios.

Around the web


 +1 review
  • Michael LeeMaker of things for humans

    Really nice and simple interface. Really dig the explanation of scores on the website. That was really informative.


    None that I could think of.

    Thought the Accessibility Guide alone on the website was worth it's weight in gold in understanding what the scores mean for WCAG. I've had to meet WCAG 2.0 standards once for a certification process. Understanding all the rules was cryptic at times. Would've been awesome to have had contrast then.

    Michael Lee has used this product for one day.


You need to become a Contributor to join the discussion - Find out how.
Sam SoffesMaker@soffes · Developer & Designer
We had a really good time making this. It's a simple app, but we tried to polish it for you 😬 Here's a few of my favorite power user features & shortcuts: • Drag the popover off the menu bar to move it closer to your designs 👋 • Shift-click in the loupe to pick a color and automatically open the next loupe ✨ • Option-click in the loupe to pick a color and copy the hex code to your clipboard 📋 • Option-shift-click to do both 😎 • Show Package Contents and look in Shared Support for a command line tool version 🤓 • Press up and down in a text field to change brightness value (hold shift to change quicker) ↕️
Mat Silva@matsilva · Software engineer @cloudbees
@soffes This looks very promising. I use ColorZilla on chrome but this goes further than just picking a color from a web page. Can't tell you how many times I've needed something like this! I'll be trying it out for sure.
Sam SoffesMaker@soffes · Developer & Designer
@matsilva Great! Let me know what you think!
Matt D. SmithMaker@mds · Design Director, Studio Mds
Howdy! This is the tool that I've always wanted ever since I learned about and began integrating color contrast accessibility as part of my design process. It's easy to make the mistake of designing with really light text and not enough contrast, a mistake I made in a lot of my early career. And while there are lots of online tools that provide this same functionality, I always found it cumbersome to copy and paste hex codes over and over into the browser. This little app is lightening fast and you can use in tandem with your design tool of choice without ever having to go online. Hope you enjoy designing with it as much as I have!
Jordan@jordanslon · Self taught designer
@mds site doesnt work
Matt D. SmithMaker@mds · Design Director, Studio Mds
@jordanslon it's been going down and back up again this morning. reached out to zeit but no word yet... 😰
Rafael Conde@rafahari · Design at Netlify, co-host of Layout
@jordanslon @mds Netlify 🙈
Matt D. SmithMaker@mds · Design Director, Studio Mds
Charlie Deets@charliedeets · Product Designer, WhatsApp
Nice job guys! Super useful and really well made. Great polish.
Matt D. SmithMaker@mds · Design Director, Studio Mds
@charliedeets Thanks, Charlie
Jorge Alejandro@jorgealeds · Product Designer
This is fantastic - thanks for it! Easy purchase.
Matt D. SmithMaker@mds · Design Director, Studio Mds
@jorgealeds Great to hear, Jorge!
Karim El-Kharraz@karimmove · Lead UI/UX Designer , @hiddenfounders
I always find something inspire me from everything you do ,and ur products too
Matt D. SmithMaker@mds · Design Director, Studio Mds
@karimmove Thanks!