New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

A11y Fix

by scaleway in scaleway/ultraviolet

Fix accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts.

Apache-2.0Auto-check passedFrontend & Design

Install A11y Fix

skills CLI
$ npx skills add scaleway/ultraviolet --skill a11y-fix -a claude-code

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

GitHub CLI
$ gh skill install scaleway/ultraviolet a11y-fix --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/scaleway/ultraviolet.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/a11y-fix .claude/skills/a11y-fix && 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
a11y-fix
GitHub stars
127
Token cost
~1.3k tokens
SKILL.md length
641 words
Files
2
Skills in repo
4
Repo updated
First seen
Licence
Apache-2.0

At a glance

Fix accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts.

  • Works in 9 steps: Read the audit → Check dependencies → Read the component → …
  • The user wants to resolve accessibility issues found by the a11y-audit skill
  • Calls pnpm
  • Mentions fixing a11y/ARIA/keyboard navigation/WCAG issues in a component

What it does

A11y Fix is an agent skill from scaleway/ultraviolet. Fix accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts. Use when the user wants to resolve accessibility issues found by the a11y-audit skill, or mentions fixing a11y/ARIA/keyboard navigation/WCAG issues in a component.

Its SKILL.md is about 1.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 1 other file (for example `REFERENCE.md`).

It sits in Frontend & Design, covering Accessibility. The repository describes itself as: A monorepo Design System with React components. The licence is Apache-2.0.

When your agent uses it

  • The user wants to resolve accessibility issues found by the a11y-audit skill
  • Mentions fixing a11y/ARIA/keyboard navigation/WCAG issues in a component

Example prompts

  • “/a11y-fix”

Workflow steps

9 steps, taken from the step headings in SKILL.md.

  1. Read the audit
  2. Check dependencies
  3. Read the component
  4. Plan and confirm
  5. Generate a11y test suite (TDD)
  6. Apply fixes
  7. Verify
  8. Update audit artifacts
  9. Manual review

What it can do on your machine

Read from SKILL.md and the folder at commit 29d7205. 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

    Shell commands in SKILL.md call:

    • pnpm

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

  • Network

    No URLs in SKILL.md. Its commands use pnpm, which can reach the network depending on how they are called.

    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

A11y Fix loads about 1.3k tokens when it runs. Until then it costs about 78 tokens; SKILL.md has 641 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~78
When it runs · the whole SKILL.md, loaded when a task matches
~1.3k

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 scaleway/ultraviolet at commit 29d7205, republished under its Apache-2.0 licence (© scaleway). 641 words, ~1,341 tokens.

Download SKILL.mdSave it as .claude/skills/a11y-fix/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
a11y-fix
description
Fix accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts. Use when the user wants to resolve accessibility issues found by the a11y-audit skill, or mentions fixing a11y/ARIA/keyboard navigation/WCAG issues in a component.

Accessibility Fix

Resolve the accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts so they reflect the new state.

Workflow

Step 1: Read the audit

Locate packages/ui/src/components/<Component>/__stories__/A11y.mdx (or the path given by the user). If it does not exist, stop and tell the user to run the a11y-audit skill first.

Extract from it:

  • The Accessibility issues section, grouped by Critical / High / Medium / Low
  • The Rules section (enforced by the component vs. to apply when using)
  • The ARIA Pattern link, if any
Step 2: Check dependencies

Read the Dependencies section. If it lists other components that must be fixed first, present them to the user and ask whether to fix those before this one. If the user declines or there are none, continue.

Step 3: Read the component

Read the component source to understand the current implementation and conventions:

  • index.tsx — component logic, ARIA attributes, keyboard handlers
  • type.ts — props
  • styles.css.ts — vanilla-extract styles (focus indicators, visibility)
  • Any hooks used by the component

Follow existing conventions (vanilla-extract for styles, functional components, existing ARIA patterns in neighbour components).

Step 4: Plan and confirm

List every issue from the audit, ordered Critical → High → Medium → Low. For each, state the intended fix and the file(s) affected. Present the plan to the user and confirm before editing.

For common fix patterns and code snippets, see REFERENCE.md.

Step 5: Generate a11y test suite (TDD)

Before implementing any fix, write an accessibility test suite that documents the expected post-fix behaviour. Tests will initially fail (confirming the issues exist) and pass once the fix is applied.

Create packages/ui/src/components/<Component>/__tests__/a11y.test.tsx following the template in REFERENCE.md:

  • One describe('<component> - A11y', { tags: ['a11y'] }, ...) block.
  • For issues detectable by axe (missing role, contrast, labels, ARIA attributes), render the relevant variant and call await expectNoViolations(container).
  • For issues axe cannot catch (focus management, keyboard navigation), use React Testing Library queries and @testing-library/user-event to assert the desired behaviour (e.g. expect(trigger).toHaveFocus() after dismiss, expect(menu).toBeVisible() after ArrowDown).
  • When color contrast is relevant, iterate themes with it.for([...consoleThemesMap.entries()])('should not have violations with (theme: %s)', ...).
  • Only cover rules Enforced by the component. Skip To apply when using the component rules — those belong in consumer code.

Run the suite with pnpm test:unit -- <component-path> and confirm the expected tests fail. Do not proceed to the fix until the suite accurately documents the issues.

Step 6: Apply fixes

Implement fixes in criticality order. Prefer the smallest change that satisfies the WCAG rule referenced in the audit. Do not change the public API unless strictly necessary; if a prop must change or be added, flag it to the user first.

Show full SKILL.md (250 more words)Show less
Step 7: Verify

Run from the repo root:

  • Lint: pnpm lint
  • Typecheck: pnpm typecheck
  • Component tests: pnpm test:unit -- <component-path> (e.g. packages/ui/src/components/Alert)

The a11y test suite generated in Step 5 should now pass. Fix any failures you introduced. If a pre-existing test needs updating to reflect the a11y fix, explain why to the user before updating it.

Step 8: Update audit artifacts
  1. A11y.mdx — for each resolved issue, mark it ✅ and keep the original note for traceability. Update the Summary lines (✅/⚠️/❌) to reflect the new state. Wrap the whole "Accessibility issues" section in a <details><summary> block and rename it to "Past accessibility issues". Within that section, format each issue as a list item whose first line is the issue title (with ✅/⚠️/❌) and whose details (description, resolution, or status) go in a nested sub-list below it, e.g.:
    mdx
    - ✅ Missing ARIA props on button:
  - The following ARIA props were defined but NOT passed to the native `<button>` element: ...
  - **Resolved** by forwarding all ARIA attributes to the `<button>` element (`index.tsx`).
- ❌ Contrast failures:
  - Unresolved (theme tokens, see WCAG 1.4.3 above).
  2. index.stories.tsx — recompute the a11yStatus parameter:
    • perceivable: false if any 1.x.x rule still fails, else true
    • operable: false if any 2.x.x rule still fails, else true
    • understandable: false if any 3.x.x rule still fails, else true
    • robust: false if any 4.x.x rule still fails, else true
Step 9: Manual review

Summarize which fixes were applied, then prompt the user to manually verify with a keyboard (Tab / Enter / Space / Escape) and, if possible, a screen reader.

© scaleway, Apache-2.0. 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 1 other file in .agents/skills/a11y-fix of scaleway/ultraviolet.

  • SKILL.md
  • REFERENCE.md

Open the folder on GitHubat commit 29d7205

Compare with similar skills

A11y Fix 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.

A11y Fix compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
A11y Fix this skillscaleway/ultraviolet127—~1.3kAutomated safety check: PassApache-2.0
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.5k4 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.5k 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.5k GitHub starsUsed in 8 repos~855 tokens
    Frontend & DesignAuto-check passed

More from scaleway/ultraviolet

  • A11y Audit

    scaleway/ultraviolet

    Audit components for accessibility. An agent skill from scaleway/ultraviolet.

    127 GitHub stars~967 tokensUpdated yesterday
    Auto-check passed

  • Unit Testing

    scaleway/ultraviolet

    Write Vitest/Testing Library tests the Ultraviolet way — interact with the rendered DOM like a user, following query priority.

    127 GitHub stars~1.7k tokensUpdated yesterday
    Auto-check passed

  • Create PR

    scaleway/ultraviolet

    Create or update a GitHub Pull Request — analyze the diff, draft the description from the repo template, push with gh.

    127 GitHub stars~566 tokensUpdated yesterday
    Auto-check passed

Categories

Questions about A11y Fix

What does A11y Fix do?

Fix accessibility issues documented in a component's A11y.mdx audit file by editing the component source, then refresh the audit artifacts. A11y Fix is an agent skill from scaleway/ultraviolet.mdx audit file by editing the component source, then refresh the audit artifacts.

When should I use A11y Fix?

A11y Fix fits situations like: the user wants to resolve accessibility issues found by the a11y-audit skill; mentions fixing a11y/ARIA/keyboard navigation/WCAG issues in a component.

How do I install A11y Fix in Claude Code?

Run `npx skills add scaleway/ultraviolet --skill a11y-fix -a claude-code`. Or copy the skill folder (.agents/skills/a11y-fix in scaleway/ultraviolet) into .claude/skills/a11y-fix in your project. Claude Code loads it when a task matches its description.

How do I install A11y Fix in Codex?

Run `npx skills add scaleway/ultraviolet --skill a11y-fix -a codex`. Or copy the skill folder (.agents/skills/a11y-fix in scaleway/ultraviolet) into .agents/skills/a11y-fix in your project. Codex loads it when a task matches its description.

Can I use A11y Fix 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 scaleway/ultraviolet --skill a11y-fix -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/a11y-fix, .gemini/skills/a11y-fix, .github/skills/a11y-fix and .opencode/skills/a11y-fix in your project.

What does A11y Fix need to run?

Going by SKILL.md and its folder, A11y Fix needs the command-line tools its instructions call (pnpm).

Does A11y Fix 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 A11y Fix 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 A11y Fix use?

A11y Fix is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does A11y Fix use?

About 1.3k tokens (SKILL.md is roughly 5.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to A11y Fix?

Skills that share tags, products or a category with A11y Fix: 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.5k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains A11y Fix?

scaleway (a GitHub organization) maintains it in scaleway/ultraviolet, which has 127 GitHub stars. The repository holds 4 skills in this directory. The repository was last updated on October 8, 2026.

Source: scaleway/ultraviolet on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.