Color check helps reviewers verify specific colors used on a proof and instantly check color contrast between any two areas – ensuring compliance with the Web Content Accessibility Guidelines (WCAG) level you’ve selected. Whether you’re checking brand color accuracy or ensuring legibility, this tool brings confidence and clarity to your review process.
What is WCAG?
WCAG stands for the Web Content Accessibility Guidelines. These guidelines set the standard for making digital content accessible to everyone – including people with visual impairments.
When it comes to color contrast, WCAG defines the minimum contrast ratio between text and its background to ensure it’s readable. The higher the contrast, the easier it is for more people to read your content.
What’s the difference between AA and AAA?
WCAG defines two common levels of accessibility for color contrast:
AA is the standard level that most websites and digital content aim to meet.
AAA is a more stringent level, offering even greater readability – especially for small text.
Meeting AA means your content is accessible to most users. AAA provides extra assurance, especially for audiences with higher accessibility needs.
Color check is available on all plans and just a click away via the eyedropper icon in the magic tools.
To use color check
Step 1
Click the eyedropper icon found in the magic tools.
Step 2
Click the text color dot. A color picker will reveal. Click the eyedropper icon to select a pixel on the proof, or type in the color value (e.g hex, RGB, HSL).
Step 3
Repeat step 2 for the background color dot.
The contrast will be calculated when both the text color and background color have been set. The results will be one of the following: Excellent, good, poor.
For example:
Excellent:
Good:
Poor:
Tips
Select the level of Web Content Accessibility Guidelines (WCAG) to check the color contrast against: AA or AAA.