Accessibility & UX

WCAG 2.2 AA patterns and UX states (loading/empty/error) for Power Platform components.

Tested · Works

Test report

Verdict
Tested · Works
Score
8.8/10
Tested
Jul 14, 2026
Environment
Claude Code 2.x (agent harness)
Upstream re-checked
Aug 10, 2026 · 6c966de

Built an accessible login form from its react-patterns.md and ux-patterns.md: got aria-describedby+role=alert wiring and the inline-vs-full-page spinner rule a baseline attempt skipped — though the skill's own cross-link to ../code-apps/fluent-ui.md breaks if you copy just this one skill folder.

Scored on four weighted criteria — install, triggering, output vs. baseline, docs. How scoring works

  • Installs cleanly 4/5
  • Triggers reliably 5/5
  • Output vs. baseline 8/10
  • Docs & honesty 5/5

What Accessibility & UX does

Provides WCAG 2.2 AA accessibility guidance, React/Fluent UI accessibility patterns, and UX design specs (loading, empty, and error states, forms, navigation, responsive breakpoints) for Power Platform Code Apps, Canvas Apps, and PCF controls. SKILL.md is explicitly a summary only — real implementation detail lives in seven linked sub-files that must be read before coding. Triggers on building accessible components, WCAG review, form accessibility, keyboard navigation, and UI state design.

How to install Accessibility & UX

git clone https://github.com/korchard333/claude-power-platform-community
cd claude-power-platform-community
mkdir -p ~/.claude/skills
cp -r .claude/skills/accessibility-ux ~/.claude/skills/accessibility-ux

Skills live in ~/.claude/skills/ (global) or .claude/skills/ (per-project). Restart Claude Code after installing.

Commands — how to trigger Accessibility & UX

  • /accessibility-ux WCAG 2.2 AA patterns and UX states (loading/empty/error) for Power Platform components.

It also activates on plain-language prompts like these:

  • Build me an accessible data table with sortable columns for Canvas.
  • Review this login form for WCAG 2.2 AA compliance issues please.
  • Design the loading and empty states for our contacts list page.

Frequently asked questions

Is the Accessibility & UX skill free?
Yes. The skill itself is free from korchard333/claude-power-platform-community. SkillProof publishes the install command and an independent test verdict at no cost.
Does Accessibility & UX work with Claude Code?
We tested it with Claude Code 2.x (agent harness) on Jul 14, 2026. Verdict: Tested · Works. Built an accessible login form from its react-patterns.md and ux-patterns.md: got aria-describedby+role=alert wiring and the inline-vs-full-page spinner rule a baseline attempt skipped — though the skill's own cross-link to ../code-apps/fluent-ui.md breaks if you copy just this one skill folder.
What is the Accessibility & UX SkillProof Score?
8.8/10 — installs cleanly 4/5, triggers reliably 5/5, output vs. baseline 8/10, docs & honesty 5/5.
How do I install Accessibility & UX?
Copy the install command from this page, run it in your terminal, and restart Claude Code. Skills live in ~/.claude/skills/ (global) or .claude/skills/ inside a project.
Can I use Accessibility & UX with Cursor, Copilot, Gemini CLI, Codex or other AI tools?
The SKILL.md format is native to Claude (Claude Code, Desktop, claude.ai). The instructions inside adapt to other assistants: Cursor rules, GitHub Copilot instructions, Windsurf rules, Custom GPTs, AGENTS.md for OpenAI Codex, and GEMINI.md for Google Gemini CLI — our conversion guides cover each, and the free converter on the tools page does the wrapping for you.