a11y-keyboard-focus

Audit keyboard operability and focus management for WCAG 2.2 compliance.

1|Updated Feb 11, 2026
One-click install
npx skills add https://github.com/tsuji-tomonori/diopside-v3 --skill a11y-keyboard-focus
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: a11y-keyboard-focus
Source: https://github.com/tsuji-tomonori/diopside-v3/tree/main/.opencode/skills/a11y-keyboard-focus
Command: npx skills add https://github.com/tsuji-tomonori/diopside-v3 --skill a11y-keyboard-focus

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses issues with keyboard navigation, focus visibility, and focus management in web applications, ensuring that all users can effectively interact with the interface using only a keyboard.

Core Features & Use Cases

  • Keyboard Navigation Audit: Verifies that all interactive elements are focusable and navigable via the Tab key.
  • Focus Order Validation: Ensures the tab order logically follows the visual layout.
  • Focus Visibility: Guarantees that the currently focused element is clearly indicated.
  • Focus Not Obscured: Implements checks and solutions for WCAG 2.2's "Focus Not Obscured (Minimum)" to prevent focus from being hidden by fixed headers, modals, or other overlays.
  • Use Case: Review a complex form with multiple modals and fixed navigation elements to ensure a keyboard-only user can complete all tasks without losing track of focus or encountering traps.

Quick Start

Review the accessibility of the main dashboard page for keyboard navigation and focus issues.

Frequently Asked Questions about a11y-keyboard-focus

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix keyboard navigation issues with tab order and focus visibility in web applications?

Fix keyboard navigation by auditing interactive elements to ensure they are focusable via the Tab key, verifying the tab order matches the visual layout, and guaranteeing the focused element has a clear visual indicator.

What is the WCAG 2.2 Focus Not Obscured (Minimum) criterion for keyboard accessibility?

The WCAG 2.2 Focus Not Obscured (Minimum) criterion ensures the focused element is never hidden by fixed headers, modals, or overlays, allowing keyboard users to always see their current position on the page.

How do I audit complex UIs with modals and fixed headers for keyboard operability?

Audit complex UIs by reviewing interactive components to ensure keyboard users can complete tasks without losing track of focus or encountering traps, verifying focus management across modals and fixed navigation elements.

How do I prevent focus from being trapped in dynamic web content when using keyboard navigation?

Prevent focus trapping by implementing focus management checks that ensure predictable tab navigation through dynamic content, verifying that focus moves logically and remains visible throughout user interactions.

Does this keyboard accessibility review work with complex forms containing multiple modals?

Yes, this keyboard accessibility review evaluates complex forms with multiple modals and fixed navigation elements, ensuring keyboard-only users can complete all tasks without losing track of focus or encountering navigation traps.