- Minimum Contrast Ratios:Text elements must meet minimum color contrast ratio thresholds.Success Criterion: Ensure a color contrast of at least 4.5:1 for small text or 3:1 for large text.Large text is defined as 18pt (24 CSS pixels) or 14pt bold (19 CSS pixels).
- Manual Review for 1:1 Ratio:Elements with a 1:1 ratio are considered "incomplete" and require a manual review.
- Color Contrast Analysis Tools:Use the color contrast analyzer provided to find colors that adhere to the include axe DevTools Browser Extensions and axe-core, an open-source JavaScript accessibility rules library.
- Why it Matters:Low vision individuals may struggle with low contrast, making it hard to distinguish details.Text with insufficient contrast can be challenging for those with low vision or color blindness.
- Statistics:Nearly three times more individuals have low vision than total blindness.About 8% of men and 0.4% of women in the US cannot see the average full spectrum of colors.
- Consideration of Transparency and Opacity:Transparency and opacity in background are considered.Detecting transparency and opacity in the foreground is more challenging due to various factors like 1:1 colors, CSS gradients, pseudo-elements, borders, and tricky positioning.
- Rule Description:All text elements must adhere to WCAG 2 AA contrast ratio thresholds.The algorithm checks text elements to ensure the contrast between foreground text and background colors meets the specified standards.
