Skip to main content

How to find Color Combinations to avoid?

Identify low-contrast color pairs that fail accessibility standards.

BarrierBreak A11yInspect provides details of color combinations that should be avoided on a webpage to meet WCAG contrast requirements. This helps identify background and foreground color pairs that may not meet accessibility standards.

Steps to View Color Combinations to Avoid​

  1. Open a webpage in your browser.
  2. Open Inspect.
  3. In the Elements panel, select the A11yInspect tab.
  4. Choose the CSS Overview tab.
  5. Review the section labeled Color Combinations to Avoid to view all color pairs that do not meet the required contrast ratio.