Contraste is a native macOS utility that calculates the contrast ratio between any two colors and tells you instantly whether that pairing satisfies the Web Content Accessibility Guidelines. It lives in your menu bar, samples colors from anywhere on your screen, and delivers a clear AA and AAA verdict in seconds.
What is Contraste?
Contraste is a compact Mac menu-bar app purpose-built to evaluate color contrast against WCAG 2.1 — the international benchmark governing whether text on a digital interface is legible to people with low vision or color deficiency. The problem it addresses is deceptively simple but chronically missed: a color pairing that looks crisp to a designer with typical color vision can be functionally invisible to a meaningful share of real users.
WCAG defines minimum contrast ratios — 4.5:1 for normal-weight text and 3:1 for large or bold text at the AA level, with stricter thresholds still at AAA. Contraste turns those abstract numbers into an immediate, actionable signal: pick two colors, get your ratio, know your compliance status before a single line of CSS is written.
What does Contraste do best?
The system-wide eyedropper is the feature that earns Contraste a permanent slot in my menu bar. You hover over any pixel — inside Figma, Sketch, a live browser tab, a Keynote deck, a PDF — sample it with a keypress, and the contrast ratio updates in real time. No manual hex entry, no browser tab switching, no clipboard gymnastics. I have audited a ten-screen design in the time it would have taken me to type a single value into a web-based contrast checker.
What I find equally valuable is that Contraste surfaces both WCAG compliance levels simultaneously. AA and AAA pass/fail results sit side by side, so you can make deliberate trade-offs rather than binary ones. Healthcare and government projects often demand AAA; most commercial products aim for AA. Contraste shows you exactly where you land on both scales without requiring you to toggle modes or run two separate tools.
How does Contraste compare to browser DevTools?
Browser DevTools catch contrast failures in rendered HTML — but only once you have already written the CSS and loaded a page in a browser. That is fine for patching issues in a live codebase, but it means you are always correcting after the fact. Contraste operates anywhere on screen, at any stage of the workflow: a Figma prototype, a Sketch artboard, a printed spec, even a color swatch pasted into a Slack message. That reach makes it genuinely useful from the earliest moments of a design review rather than as a last-mile debugging aid.
Is Contraste free?
Contraste is available on the Mac App Store at a modest one-time price — no subscription, no usage cap. Check the current listing for the exact figure; the app has consistently been priced as an affordable professional tool rather than a recurring expense. For something you will open dozens of times a week throughout a design or development career, that buy-once model is exactly right.
Who should use Contraste?
Contraste is indispensable for front-end developers writing CSS design tokens, UX designers auditing color palettes in Figma, and accessibility engineers conducting formal WCAG compliance reviews. The real audience is broader than that core cohort, though: any Mac user who ships visual interfaces — product managers, solo founders, content designers iterating in Canva — benefits from catching contrast failures in the design stage rather than receiving them in a post-launch audit letter.
If your work touches public sector contracts, app store submissions under accessibility guidelines, or any formal compliance requirement, Contraste pays for itself the first time it flags a failure you would otherwise have shipped.
What are the best Contraste alternatives?
The closest free cross-platform alternative is the Colour Contrast Analyser by TPGi — thorough and dependable, though its interface reads more as a clinical instrument than a design companion. Browser DevTools panels surface contrast failures in live HTML, but they cannot sample a Figma frame or a static mockup. Sim Daltonism simulates color-blindness perception rather than measuring ratios, so it is complementary rather than a substitute. Inside Figma, the Able and Contrast plugins are excellent for in-canvas work, but they stop at the canvas edge — Contraste spans every app on your Mac, which is its decisive advantage over any tool anchored to a single design environment.
