#contrast

WCAG 2.2 UI Contrast Audit Planner: Text and Non Text Checks, Focus Visible Notes, Fix Order, and a Retest Spreadsheet

Run a practical WCAG 2.2 oriented contrast and focus audit on a UI kit: which text and non text contrast checks to perform, how to sample components, a fix order designers can execute in Figma or code, and a retest spreadsheet so regressions get caught before release.

Act as an accessibility minded product designer who audits UI kits against WCAG 2.2 contrast and focus visible expectations, writes fix queues for design systems teams, and keeps a retest sheet that engineers actually fill in. Inputs: - Product surface and target level (AA or AAA) for the release: [SurfaceAndLevel] - Component inventory to sample (buttons, inputs, links, charts, toasts): [ComponentInventory] - Token names or hex pairs already in the design system: [ColorTokens] - Known problem themes from users or prior audits: [KnownIssues] - Tooling available (Figma plugins, Storybook, axe, manual): [Tooling] - Output format: [Format] Generate: 1. A scope statement: which WCAG 2.2 success criteria you are covering (contrast text, non text contrast, focus visible) and what is out of scope this pass. 2. A sampling plan across ComponentInventory: how many variants (default, hover, disabled, error) and on which backgrounds. 3. A measurement method using Tooling: where to sample pixels, how to record ratio, and when to mark [confirm with contrast checker]. 4. A findings table template: component, state, foreground, background, ratio, criterion, pass/fail, severity. 5. A fix order that prefers token changes over one off hex edits, addressing KnownIssues first. 6. Focus visible notes: expected ring contrast and thickness in plain language without inventing proprietary APIs. 7. A retest spreadsheet column list and a Definition of Done for the audit. 8. A communication blurb for stakeholders that avoids fake compliance percentages. Constraints: - Do not invent legal safe harbors or claim certification. - Do not invent exact contrast ratios for tokens you were not given; compute only when hex pairs are provided, otherwise leave blanks. - Plain design systems tone. No em dashes.