Top 10 Accessibility Skills for AI Coding Agents

Best for: Focused fixes to existing web interfaces

fixing-accessibility is a focused guide for repairing concrete accessibility defects in web interfaces. It helps an agent make targeted corrections without triggering unintended layout redesigns.

Use it when an existing component or interaction needs a surgical fix. For live browser diagnostics, use Chrome DevTools MCP; for forms, keyboard navigation, or live status announcements, refer to the specialized workflows below.

• Focused web UI defect remediation
• Surgical component repairs
• Dialog recommendations matched to context

Best for: Investigating accessibility problems in a live browser rendering

a11y-debugging uses Chrome DevTools MCP to inspect rendered pages: the accessibility tree, DOM nodes, keyboard focus, and Lighthouse diagnostics provide empirical evidence from the browser engine.

Use this for live browser inspection. Code snippets inspect node state and structure; verify actual screen reader speech and output with real assistive technology.

• Chrome accessibility-tree and DOM inspection
• Keyboard and Lighthouse investigation
• Configured MCP and supported Chrome required

Best for: Implementing and reviewing accessibility support in PixiJS v8 scenes

pixijs-accessibility describes a DOM overlay for selected objects in PixiJS v8 interactive canvas scenes, mapping canvas interactions to DOM-facing controls.

PixiJS v8's standard browser setup registers accessibility automatically; explicit imports apply when opting out or using custom builds. Name and test each interactive object; provide HTML alternatives for canvas relationships the overlay cannot express.

• DOM overlay for selected PixiJS v8 canvas objects
• Automatic browser registration with custom import options
• Interactive DOM overlay mapping

Best for: Auth flows, multi-step forms, validation errors, and preserving user input during recovery

forms covers form entry, authentication, autofill, multi-step flows, validation, and error recovery. Preserving user input and offering clear recovery paths are central to accessible form design.

Select this for web form implementation. Coordinate initial alert patterns with live-region status guidance and check contrast rules against project requirements.

• Authentication and autofill considerations
• Multi-step flow and error recovery
• Preserve user input and clarify correction steps

Best for: Keyboard-operable widgets, dialogs, and focus management

keyboard addresses keyboard interaction mechanics: native versus composite key handling, focus movement, restoration, dialog containment, and visible focus boundaries.

Use it to design and test keyboard navigation paths. Keyboard testing focuses on focus management and key handling; use screen readers to verify speech announcements.

• Native and composite key behavior
• Focus movement, restoration, and visibility
• Keyboard path and focus management

Best for: Dynamic results, async status, and announcements that can race or repeat

aria-live-regions guides selecting and managing live-region status announcements for dynamic web updates, addressing rapid updates, busy states, and message queuing.

Use these pattern recipes for dynamic status updates, and confirm actual speech behavior using screen readers in your target browser environments.

• Mechanism choice for dynamic status updates
• Managing update frequency, busy states, and queues
• Verifiable ARIA live patterns

Best for: Building an accessibility regression policy into CI

ci-cd establishes automated regression gates: scan key application states, maintain baselines, handle partial test runs, and require code reviews for test suppressions.

Complete workflow SHA placeholders for your environment and define team policy for regression baselines and failure handling.

• Automated scanning for key application states
• Baselines, incomplete results, and reviewed suppressions
• Clear gate policies for CI pipelines

Best for: Color-system implementation and evidence gathering for rendered pairs

better-colors assists in color-system development and rendered contrast measurement, organizing design tokens and calculating contrast ratios across foreground/background pairs.

Use it to gather contrast data for design tokens and components. Policy decisions, applicable criteria, and contrast thresholds should be determined by project guidelines or a qualified criteria owner. APCA Lc provides an optional perceptual contrast metric alongside standard measurements.

• Color token organization and pair contrast calculations
• Empirical measurement reporting for design tokens
• Support for WCAG measurements and optional APCA metrics

Best for: SwiftUI, UIKit, or AppKit accessibility, VoiceOver, Dynamic Type, and platform behavior

ios-accessibility covers native Apple platform implementation across SwiftUI, UIKit, and AppKit, including VoiceOver integration, Dynamic Type, custom accessibility actions, and media accessibility.

Treat code examples as illustrative guidance to adapt to your application context. Verify actual behavior with native tooling and real assistive technology on target devices.

• SwiftUI, UIKit, and AppKit accessibility workflows
• VoiceOver, Dynamic Type, and platform AT integration
• Native Apple UI patterns and custom actions

Best for: Contributors implementing accessibility in VS Code's own workbench

The VS Code accessibility skill is specifically designed for contributors working within the VS Code product/workbench codebase. It details workbench Accessibility Help, Accessible View providers, verbosity settings, and focus management.

Use this when contributing code directly to microsoft/vscode. Extension developers and end users should refer to extension authoring guides instead.

• Accessibility Help and Accessible View APIs
• Provider registry, verbosity, and focus management
• Designed specifically for VS Code product codebase contributors