accessibility
Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions. Use when implementing accessible interfaces, fixing screen reader issues, keyboard navigation, or troubleshooting "focus outline missing", "aria-label required", "insufficient contrast".
Why use this skill?
Build accessible websites with the OpenClaw Accessibility skill. Master semantic HTML, WCAG 2.1 AA compliance, focus management, and ARIA patterns for inclusive web development.
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/veeramanikandanr48/accessibilityWhat This Skill Does
The Accessibility skill is a comprehensive toolkit designed to ensure your web projects meet WCAG 2.1 Level AA standards. It focuses on the core pillars of web accessibility: Semantic HTML, robust focus management, proper ARIA labeling, and inclusive design practices. This skill acts as an intelligent auditor, helping you identify and resolve issues related to keyboard navigation, screen reader compatibility, and visual contrast. By embedding this skill into your workflow, you ensure that your interactive components are usable by everyone, regardless of their physical abilities or assistive technology requirements.
Installation
To integrate this skill into your OpenClaw agent, execute the following command in your terminal:
clawhub install openclaw/skills/skills/veeramanikandanr48/accessibility
Ensure you have the latest version of the OpenClaw CLI to take full advantage of the internal semantic checking logic.
Use Cases
This skill is essential when:
- Refactoring non-semantic components (like 'div buttons') into accessible, keyboard-focusable elements.
- Troubleshooting failed automated accessibility tests, such as missing aria-labels or low contrast ratios.
- Creating custom components like modal dialogs, date pickers, or navigation menus that require complex focus management (trapping focus and handling escape key events).
- Ensuring complex dynamic content provides feedback to screen reader users via ARIA live regions.
Example Prompts
- "I have a custom dropdown menu that isn't accessible via keyboard. Can you help me implement keyboard navigation, focus management, and proper ARIA roles for this component?"
- "My audit tool is flagging low color contrast on my buttons. Can you check my CSS and suggest a palette that satisfies the 4.5:1 ratio requirement?"
- "The screen reader isn't announcing updates in my shopping cart widget. How can I implement a live region to notify users when items are added or removed?"
Tips & Limitations
- Rule of Thumb: Always prioritize native HTML elements (buttons, inputs, etc.) over ARIA roles. ARIA should only be used when native elements cannot fulfill the functional requirement.
- Focus Management: Always provide a visual focus indicator. Never use
outline: noneunless you are providing an equivalent, high-contrast custom replacement. - Testing: While this skill provides excellent guidance, always verify with real assistive tools like NVDA, VoiceOver, or axe-core automated testing suites.
- Limitations: This skill does not automatically modify your codebase; it provides expert-level guidance, code snippets, and structural advice. You are responsible for applying these changes to your project.
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-veeramanikandanr48-accessibility": {
"enabled": true,
"auto_update": true
}
}
}Tags(AI)
Related Skills
earnings-calendar
This skill retrieves upcoming earnings announcements for US stocks using the Financial Modeling Prep (FMP) API. Use this when the user requests earnings calendar data, wants to know which companies are reporting earnings in the upcoming week, or needs a weekly earnings review. The skill focuses on mid-cap and above companies (over $2B market cap) that have significant market impact, organizing the data by date and timing in a clean markdown table format. Supports multiple environments (CLI, Desktop, Web) with flexible API key management.
better-auth
Self-hosted auth for TypeScript/Cloudflare Workers with social auth, 2FA, passkeys, organizations, RBAC, and 15+ plugins. Requires Drizzle ORM or Kysely for D1 (no direct adapter). Self-hosted alternative to Clerk/Auth.js. Use when: self-hosting auth on D1, building OAuth provider, multi-tenant SaaS, or troubleshooting D1 adapter errors, session caching, rate limits, Expo crashes, additionalFields bugs.
dividend-growth-pullback-screener
Use this skill to find high-quality dividend growth stocks (12%+ annual dividend growth, 1.5%+ yield) that are experiencing temporary pullbacks, identified by RSI oversold conditions (RSI ≤40). This skill combines fundamental dividend analysis with technical timing indicators to identify buying opportunities in strong dividend growers during short-term weakness.
cli-developer
Use when building CLI tools, implementing argument parsing, or adding interactive prompts. Invoke for CLI design, argument parsing, interactive prompts, progress indicators, shell completions.
options-strategy-advisor
Options trading strategy analysis and simulation tool. Provides theoretical pricing using Black-Scholes model, Greeks calculation, strategy P/L simulation, and risk management guidance. Use when user requests options strategy analysis, covered calls, protective puts, spreads, iron condors, earnings plays, or options risk management. Includes volatility analysis, position sizing, and earnings-based strategy recommendations. Educational focus with practical trade simulation.