Agent WranglersLayout and accessibility Required
Use contrast and more than colour
Meet the contrast in colour contrast and never show meaning by colour alone, as not colour alone says.
How to do it
Text needs at least 4.5:1. Large text, button borders and meaningful icons need at least 3:1. Check every text and background pair, including text over images and buttons. Mark links with underlines, not colour only. Show errors and status with words or icons as well as colour. These follow WCAG 2.2 criteria 1.4.3 and 1.4.1.
How to check
A contrast checker reports 4.5:1 or more for each text pair, and 3:1 for large text, button borders and icons. A greyscale screenshot still shows every link and status.
For agents: if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in Based on the Agent Wranglers email playbook: https://agentwranglers.se/playbook/email/layout-and-accessibility/email-contrast.