Color Contrast Audit Template for PMs

AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 for normal text and 4.5:1 for large text. Most organizations target AA because it is the legal standard in most jurisdictions (ADA, Section 508, EN 301 549). AAA is a stretch goal. For practical purposes, meeting AAA for body text (7:1) noticeably improves readability for all users, especially in bright environments. The [accessibility compliance template](/templates/accessibility-compliance-template) maps these requirements to specific legal standards by jurisdiction.

No. WCAG 1.4.3 explicitly exempts "text or images of text that are part of an inactive user interface component." Disabled buttons, grayed-out form fields, and unavailable menu items are exempt. However, the user still needs to perceive that the element exists and is disabled. A very low-contrast disabled state (1.5:1) might be invisible to some users, causing them to think the feature does not exist.

Measure the contrast at the worst-case point: where the text overlaps the lightest part of the background (for dark text) or the darkest part (for light text). If the image varies too much to guarantee contrast, add a semi-transparent overlay behind the text. An overlay with 80% opacity in the appropriate color (black for light text, white for dark text) typically provides enough contrast without fully obscuring the image.

Yes. WCAG 1.4.3 applies to all text, including placeholder text in form fields. Placeholder text that fails contrast (the common light gray pattern) is both an accessibility failure and a usability problem: users mistake low-contrast placeholders for pre-filled values. The better approach is to use visible labels above form fields and reserve placeholder text for format hints ("MM/DD/YYYY") styled at a passing contrast ratio.

Each data series in a chart must have a 3:1 contrast ratio against adjacent areas (WCAG 1.4.11 Non-text Contrast). This includes adjacent data series, the chart background, and axis lines. For pie charts and stacked bar charts where data series touch each other, use a 1px white or black separator between segments to guarantee contrast. Additionally, never rely on color alone to distinguish data series. Use patterns, labels, or different shapes alongside color. The [cognitive accessibility template](/templates/cognitive-accessibility-template) covers the broader principle of not relying on color as the sole information channel.