CSS Terminology
Non-Text Contrast
The WCAG 2.1 requirement (Success Criterion 1.4.11) that UI components and graphical objects have a minimum 3:1 contrast ratio against adjacent colors.
Understanding Non-Text Contrast
Code Examples
Using Non-Text Contrast in TWColors
Our tools help you work with non-text contrast effectively. Try our color tools to see how non-text contrast affects your designs.
Explore our tools →Related Terms
Learn More
How to Implement Dark Mode Colors in Tailwind CSS
A comprehensive guide to implementing dark mode with accessible color choices in Tailwind CSS.
Color Accessibility Guide for Tailwind CSS
A complete guide to creating accessible color combinations that meet WCAG AA and AAA standards.
10 Tips for Better Color Contrast in Web Design
Quick tips to instantly improve the readability and accessibility of your color choices.
Designing Color Blindness Friendly Interfaces
Practical techniques for designing interfaces that work for colorblind users.
Try Our Color Tools
Apply your knowledge of non-text contrast with our free tools.
Explore Tools