Color Contrast

A complete accessibility utility for iOS and macOS.

Evaluate your designs for accessibility against WCAG 2.x for free.
‍
No need to download multiple plugins for Figma, Figjam, Sketch, Adobe XD, and every browser that has ever existed - as Color Contrast works at the OS level, all apps and websites are automagically supported.
‍

WCAG Compliance

Use Color Contrast to measure the contrast between two colours in any iOS app screen or mobile webpage. Ensure your app meets the internationally recognized recommendations in the Web Content Accessibility Guidelines (WCAG), for both versions 2.1 and 3.0 (Silver).

Color Suggestions

Unlike like other accessibility tools that only tell you when you have failed, Color Contrast assists you with smart suggestions. Choose color combinations that comply with accessibility contrast guidelines.

Automated testing

Discover how well your app or mobile webpage aligns with other accessibility guidelines, not just color contrast. Run AXE automated tests to gain an overview of all outstanding accessibility issues.

Real-time accessibility feedback

iOS
‍
Get an instant Color Contrast appraisal of images and content in any app screen or mobile web screenshot.

macOS
‍
Check Color Contrast on your macOS computer:

Ensure compliance with WCAG

WCAG 2.1 accessibility guidelines have three levels of compliance, A, AA and AAA. When considering large text (i.e. text which is above 18pt or larger), the minimum AA color contrast ratio is 3:1 and for AAA the ratio is 4.5:1.

For normal text, the AA color contrast ratio is 4.5:1 and for AAA the color contrast ratio is 7:1.

MORE INFORMATION ABOUT WCAG 2.x

S-LUV Advanced Perceptual Algorithm

The W3C Accessibility Guidelines 3.0 (Silver) reference an experimental color algorithm known as S-LUV Advanced Perceptual Contrast (SAPA) or Advanced Perceptual Contrast Algorithm. This algorithm can be enabled within the app via left-hand menu. To re-iterate, this algorithm is experimental and is likely to change in future.

More information about APAC

Generate and share reports

With Color Contrast you can also copy the current color to the clipboard in the follow formats:

HTML Hex (e.g. #EEFFEE)

UIColor from RGBA (e.g. UIColor(red:0, green:0, blue:0, alpha:0) )

UIColor from HSB (e.g UIColor(hue:0, saturation:0, brightness:0, alpha:0))

Illustration of a person on a ladder using large building blocks

About Accessible Resources

We provide tools and resources that help solve web accessibility issues. We empower developers, product designers and researchers to create accessible experiences that are delightful for everyone.

Our team combines experience from leading brands such as Google, Apple and Spotify.