a11y-pointer-targets

Community

Enhance pointer interactions for accessibility.

Authortsuji-tomonori
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill ensures that pointer-based user interfaces, especially those involving drag-and-drop or small targets, are usable by everyone, including individuals with motor impairments, by meeting WCAG 2.2 AA standards.

Core Features & Use Cases

  • Target Size Compliance: Ensures clickable/tappable areas meet the minimum 24x24 CSS pixel requirement.
  • Drag-and-Drop Alternatives: Provides non-drag alternatives for essential operations.
  • Misoperation Prevention: Implements safeguards against accidental actions and provides cancellation options.
  • Use Case: Redesigning a mobile app's settings screen with many small icons, ensuring each is easily tappable and that accidental presses of critical functions are prevented.

Quick Start

Apply the a11y-pointer-targets skill to the user profile editing form to ensure all interactive elements meet WCAG 2.2 AA standards.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: a11y-pointer-targets
Download link: https://github.com/tsuji-tomonori/diopside-v3/archive/main.zip#a11y-pointer-targets

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.