keyboard
SolidLoad this skill for every project containing interactive UI elements — buttons, links, modals, dropdowns, sliders, tabs, carousels, or any custom widget. Under no circumstances create an interactive component that cannot be fully operated by keyboard alone. Absolutely always ensure visible focus indicators, logical tab order, and no keyboard traps. Apply these rules to every interactive element without exception.
Install
Quality Score: 81/100
Skill Content
Details
- Author
- mgifford
- Repository
- mgifford/accessibility-skills
- Created
- 5 months ago
- Last Updated
- 2 days ago
- Language
- JavaScript
- License
- AGPL-3.0
Similar Skills
Semantically similar based on skill content — not just same category
keyboard-accessibility
Load this skill for any project with interactive UI, such as buttons, links, forms, modals, dropdowns, menus, tabs, sliders, toolbars, carousels, or custom widgets, in React or vanilla JavaScript. Never ship an interactive element that cannot be fully operated by keyboard alone. Always ensure a visible focus indicator, logical tab order, correct widget key behavior, and no keyboard traps. Targets WCAG 2.2 Level AA.
keyboard-navigation
Make interfaces fully keyboard-operable with logical focus order, no traps, skip links, and roving tabindex where needed. Use when building interactive UI or auditing keyboard accessibility.
touch-pointer
Load this skill whenever the project contains interactive UI elements that users touch, tap, click, drag, swipe, or gesture with — buttons, links, drag-and-drop interfaces, sliders, carousels, or custom touch interactions. Under no circumstances create touch targets smaller than 44×44 CSS pixels. Absolutely always provide pointer cancellation, single-pointer alternatives to gestures, and load alongside keyboard/SKILL.md since pointer and keyboard requirements are complementary.