ARIA roles, states and properties for custom widgets and dynamic content.

MITAuto-check passedFrontend & Design

Install Aria Specialist

skills CLI
$ npx skills add Community-Access/accessibility-agents --skill aria-specialist -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install Community-Access/accessibility-agents aria-specialist --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/Community-Access/accessibility-agents.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/aria-specialist .claude/skills/aria-specialist && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
aria-specialist
GitHub stars
423
Token cost
~1.6k tokens
SKILL.md length
661 words
Files
5 (incl. references)
Skills in repo
108
Repo updated
First seen
Licence
MIT

At a glance

ARIA roles, states and properties for custom widgets and dynamic content.

  • Works in 12 steps: Does every interactive element have an… → Are ARIA roles used only where native… → Are ARIA states (aria-expanded,… → …
  • Tasks that involve Accessibility
  • SKILL.md covers First Rule of ARIA, ARIA You Must Never Add, Icons and Decorative Elements and Forms, plus 4 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Aria Specialist is an agent skill from Community-Access/accessibility-agents. ARIA roles, states and properties for custom widgets and dynamic content.

Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 7 other files, including reference files (for example `agents/openai.yaml`, `examples/findings.json` and `references/aria-you-must-use-correctly.md`).

It sits in Frontend & Design, covering Accessibility. The repository describes itself as: Accessibility review agents for Claude Code, GitHub Copilot, and Claude Desktop. Eleven specialists that enforce WCAG 2.2 AA compliance so AI coding tools stop generating… The licence is MIT.

When your agent uses it

  • Tasks that involve Accessibility

Example prompts

  • “/aria-specialist”

Workflow steps

12 steps, taken from the first numbered list in SKILL.md.

  1. Does every interactive element have an accessible name?
  2. Are ARIA roles used only where native HTML cannot express the semantics?
  3. Are ARIA states (aria-expanded, aria-selected, aria-checked) updated dynamically when state changes?
  4. Do aria-controls and aria-labelledby point to valid, existing IDs?
  5. Are live regions present and using the correct politeness level?
  6. Is focus managed correctly (modals trap focus, dialogs return focus)?
  7. Are decorative elements hidden from assistive technology?
  8. Are elements with aria-label` reserved for major navigable content (not decorative sections, stats bars, or banners)?
  9. Does the page have a reasonable number of landmarks? Canonical set for informational pages: banner + navigation(s) + main + contentinfo…
  10. When a has both aria-label and a heading, does the aria-label text match the heading? (If yes, switch to aria-labelledby` pointing to the…
  11. Are there elements nested inside parent sections that already provide heading-based navigation for the same content?
  12. Is role="region" used on code blocks, install snippets, demo panels, or promotional banners? If so, remove it -- these are not navigable…

What it can do on your machine

Read from SKILL.md and the folder at commit decf6ba. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are html).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Aria Specialist loads about 1.6k tokens when it runs, and up to ~4.7k if it reads all its reference files. Until then it costs about 22 tokens; SKILL.md has 661 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~22
When it runs · the whole SKILL.md, loaded when a task matches
~1.6k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~4.7k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from Community-Access/accessibility-agents at commit decf6ba, republished under its MIT licence (© Community-Access). 661 words, ~1,566 tokens.

Download SKILL.mdSave it as .claude/skills/aria-specialist/SKILL.md (or your agent's skills folder). This skill also uses 4 other files; get the full folder from GitHub.
name
aria-specialist
description
ARIA roles, states and properties for custom widgets and dynamic content.
license
MIT
disable-model-invocation
true
metadata.tier
specialist
metadata.domain
web
metadata.output
findings
metadata.effort
medium
metadata.title
ARIA Specialist

You are an ARIA specialist. You ensure that ARIA roles, states, and properties are used correctly across web applications. Incorrect ARIA is worse than no ARIA -- it actively breaks the screen reader experience.

First Rule of ARIA

Do not use ARIA if native HTML can express the semantics. A <button> is always better than <div role="button">. A <dialog> is always better than <div role="dialog">. Check native HTML first, ARIA second.

ARIA You Must Never Add

These elements already have implicit roles. Adding ARIA to them is redundant and can cause double announcements in screen readers:

  • <header> -- already banner landmark
  • <nav> -- already navigation landmark
  • <main> -- already main landmark
  • <footer> -- already contentinfo landmark
  • <button> -- never add role="button"
  • <a href> -- never add role="link"
  • <input type="checkbox"> -- never add role="checkbox"
  • <select> -- never add role="listbox"

Exception: Multiple <nav> elements on one page need aria-label to differentiate them ("Main navigation", "Footer navigation").

Icons and Decorative Elements

Always hide icons from screen readers. They create verbosity.

html
<!-- Button with icon -- hide the icon -->
<button>
  <svg aria-hidden="true">...</svg>
  Save
</button>

<!-- Icon-only button -- needs aria-label -->
<button aria-label="Close dialog">
  <svg aria-hidden="true">...</svg>
</button>

<!-- Decorative image -->
<img src="decoration.png" alt="" aria-hidden="true">

Never leave an icon-only button without an accessible name. Never let an SVG be visible to assistive technology when there is already visible text.

Forms

  • Every input needs a <label> with matching for attribute
  • Group related inputs with <fieldset> and <legend>
  • Associate errors with aria-describedby
  • On submit with errors: focus moves to first error field
  • Never rely on color alone to indicate errors
  • Required fields use the required attribute, not just aria-required

Validation Checklist

When reviewing any component, check:

  1. Does every interactive element have an accessible name?
  2. Are ARIA roles used only where native HTML cannot express the semantics?
  3. Are ARIA states (aria-expanded, aria-selected, aria-checked) updated dynamically when state changes?
  4. Do aria-controls and aria-labelledby point to valid, existing IDs?
  5. Are live regions present and using the correct politeness level?
  6. Is focus managed correctly (modals trap focus, dialogs return focus)?
  7. Are decorative elements hidden from assistive technology?
  8. Are <section> elements with aria-label reserved for major navigable content (not decorative sections, stats bars, or banners)?
  9. Does the page have a reasonable number of landmarks? Canonical set for informational pages: banner + navigation(s) + main + contentinfo (typically 5-6). Region landmarks should be rare additions.
  10. When a <section> has both aria-label and a heading, does the aria-label text match the heading? (If yes, switch to aria-labelledby pointing to the heading. If no, the mismatch is a bug.)
  11. Are there <section aria-label> elements nested inside parent sections that already provide heading-based navigation for the same content?
  12. Is role="region" used on code blocks, install snippets, demo panels, or promotional banners? If so, remove it -- these are not navigable destinations.
  13. Will a screen reader announce this component in a way that makes sense?
Show full SKILL.md (216 more words)Show less

Structured Output for Sub-Agent Use

When invoked as a sub-agent by the web-accessibility-wizard, consume the ## Web Scan Context block provided at the start of your invocation - it specifies the page URL, framework, audit method, thoroughness level, and disabled rules. Honor every setting in it.

Provide framework-specific code fixes using the correct syntax for the detected stack (React camelCase props, Vue binding syntax, Angular attribute binding, etc.).

Return each issue in this exact structure so the wizard can aggregate, deduplicate, and score results:

text
### [N]. [Brief one-line description]

- **Severity:** [critical | serious | moderate | minor]
- **WCAG:** [criterion number] [criterion name] (Level [A/AA/AAA])
- **Confidence:** [high | medium | low]
- **Impact:** [What a real user with a disability would experience - one sentence]
- **Location:** [file path:line, or CSS selector, or component name]

**Current code:**
[code block showing the problem]

**Recommended fix:**
[code block showing the corrected code in the detected framework syntax]

Confidence rules:

  • high - definitively wrong: missing required ARIA attribute, invalid role, broken ID reference, confirmed structural issue
  • medium - likely wrong: unusual pattern, probable issue, may need browser verification to confirm
  • low - possibly wrong: context-dependent, may be intentional, flagged for human review
Output Summary

End your invocation with this summary block (used by the wizard for / progress announcements):

text
## ARIA Specialist Findings Summary
- **Issues found:** [count]
- **Critical:** [count] | **Serious:** [count] | **Moderate:** [count] | **Minor:** [count]
- **High confidence:** [count] | **Medium:** [count] | **Low:** [count]

Always explain your reasoning. Developers need to understand why, not just what.

Reference files

Read one only when the task reaches it. Do not read them all up front.

  • references/aria-you-must-use-correctly.md - ARIA You Must Use Correctly
  • references/landmark-and-region-overuse.md - Landmark and Region Overuse, Accessible Names and Descriptions

Output contract

Return only JSON matching skills/a11y-core/schemas/findings.schema.json. No prose, no summary, no restated instructions. One object, one array of findings.

Shared rules, dispatch contract and schemas: skills/a11y-core/SKILL.md. Authoritative specifications for this skill: skills/a11y-core/references/sources.md.

© Community-Access, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 4 other files (references) in skills/aria-specialist of Community-Access/accessibility-agents.

  • SKILL.md
  • agents/openai.yaml
  • examples/findings.json
  • references/aria-you-must-use-correctly.md
  • references/landmark-and-region-overuse.md

Open the folder on GitHubat commit decf6ba

Compare with similar skills

Aria Specialist next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Aria Specialist compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Aria Specialist this skillCommunity-Access/accessibility-agents423—~1.6kAutomated safety check: PassMIT
Web Interface Guidelines Reviewervercel-labs/openreview1.7k97 repos~308Automated safety check: PassNone
Accessibility Reviewmarkmead/hyperui12k1 repos~1.1kAutomated safety check: PassMIT
Web Animation DesignbaptisteArno/typebot.io11k2 repos~2.7kAutomated safety check: PassCustom licence
Accessibility Fixeribelick/ui-skills9.6k4 repos~1.2kAutomated safety check: PassMIT
Wcag Audit PatternsvmDeshpande/ai-agent-automation17811 repos~610Automated safety check: PassApache-2.0

Similar skills

  • Web Interface Guidelines Reviewer

    vercel-labs/openreview

    Official

    Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my…

    1.7k GitHub starsUsed in 97 repos~308 tokens
    Frontend & DesignAuto-check passed
  • Accessibility Review

    markmead/hyperui

    Run a WCAG 2.1 AA accessibility audit on a design or page. An agent skill from markmead/hyperui.

    12k GitHub starsUsed in 1 repo~1.1k tokens
    Frontend & DesignAuto-check passed
  • Web Animation Design

    baptisteArno/typebot.io

    Guides easing, timing and animation choices for UI motion, based on a web animation course, and reviews existing animations in a before-and-after table.

    11k GitHub starsUsed in 2 repos~2.7k tokens
    Frontend & DesignAuto-check passed
  • Accessibility Fixer

    ibelick/ui-skills

    Audits and fixes HTML accessibility problems such as ARIA labels, keyboard navigation, focus management, contrast and form errors with minimal changes.

    9.6k GitHub starsUsed in 4 repos~1.2k tokens
    Frontend & DesignAuto-check passed
  • Wcag Audit Patterns

    vmDeshpande/ai-agent-automation

    Conduct WCAG 2.2 accessibility audits with automated testing, manual verification, and remediation guidance.

    178 GitHub starsUsed in 11 repos~610 tokens
    Frontend & DesignAuto-check passed
  • Baseline UI

    ibelick/ui-skills

    Applies a fixed set of UI rules for stack, components, interaction, animation, typography and layout, or reviews a file against them with concrete fixes.

    9.6k GitHub starsUsed in 8 repos~855 tokens
    Frontend & DesignAuto-check passed

More from Community-Access/accessibility-agents

All 108 skills in this repo
  • A11y Core

    Community-Access/accessibility-agents

    Shared contract for the Accessibility Agents skills - dispatch, findings schema, report rules.

    423 GitHub stars~1.2k tokensUpdated 17 days ago
    Auto-check passed
  • Kb Web Scanning

    Community-Access/accessibility-agents

    Reference data, not a reviewer. An agent skill from Community-Access/accessibility-agents.

    423 GitHub stars~1.2k tokensUpdated 17 days ago
    Auto-check passed
  • Accessibility Lead

    Community-Access/accessibility-agents

    Web UI accessibility lead. An agent skill from Community-Access/accessibility-agents.

    423 GitHub stars~932 tokensUpdated 17 days ago
    Auto-check passed
  • Alt Text Headings

    Community-Access/accessibility-agents

    Alt text, SVGs, figures, charts, heading order, page titles and landmarks.

    423 GitHub stars~1.5k tokensUpdated 17 days ago
    Auto-check passed
  • Cognitive Accessibility

    Community-Access/accessibility-agents

    Plain language, WCAG 2.2 cognitive criteria, COGA guidance and auth UX.

    423 GitHub stars~1.4k tokensUpdated 17 days ago
    Auto-check passed
  • Contrast Master

    Community-Access/accessibility-agents

    Color contrast, themes, dark mode, non-text contrast and color-only meaning.

    423 GitHub stars~1.4k tokensUpdated 17 days ago
    Auto-check passed

Questions about Aria Specialist

What does Aria Specialist do?

ARIA roles, states and properties for custom widgets and dynamic content. Aria Specialist is an agent skill from Community-Access/accessibility-agents. ARIA roles, states and properties for custom widgets and dynamic content.

When should I use Aria Specialist?

Aria Specialist fits situations like: tasks that involve Accessibility.

How do I install Aria Specialist in Claude Code?

Run `npx skills add Community-Access/accessibility-agents --skill aria-specialist -a claude-code`. Or copy the skill folder (skills/aria-specialist in Community-Access/accessibility-agents) into .claude/skills/aria-specialist in your project. Claude Code loads it when a task matches its description.

How do I install Aria Specialist in Codex?

Run `npx skills add Community-Access/accessibility-agents --skill aria-specialist -a codex`. Or copy the skill folder (skills/aria-specialist in Community-Access/accessibility-agents) into .agents/skills/aria-specialist in your project. Codex loads it when a task matches its description.

Can I use Aria Specialist in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add Community-Access/accessibility-agents --skill aria-specialist -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/aria-specialist, .gemini/skills/aria-specialist, .github/skills/aria-specialist and .opencode/skills/aria-specialist in your project.

What does Aria Specialist need to run?

SKILL.md names no scripts, command-line tools or credentials: Aria Specialist is instructions for the agent only.

Does Aria Specialist access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Aria Specialist safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Aria Specialist use?

Aria Specialist is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Aria Specialist use?

About 1.6k tokens (SKILL.md is roughly 6.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.1k tokens, read only when the agent opens those files.

What are the alternatives to Aria Specialist?

Skills that share tags, products or a category with Aria Specialist: Web Interface Guidelines Reviewer (vercel-labs/openreview, 1.7k stars), Accessibility Review (markmead/hyperui, 12k stars), Web Animation Design (baptisteArno/typebot.io, 11k stars) and Accessibility Fixer (ibelick/ui-skills, 9.6k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Aria Specialist?

Community-Access (a GitHub organization) maintains it in Community-Access/accessibility-agents, which has 423 GitHub stars. The repository holds 108 skills in this directory. The repository was last updated on September 23, 2026.

Source: Community-Access/accessibility-agents on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.