Web Interface Guidelines Reviewer
vercel-labs/openreview
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my…
Expert WCAG (Web Content Accessibility Guidelines) advisor covering WCAG 2.0, 2.1, and 2.2 — the W3C international accessibility standards.
Install Wcag
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcag --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/wcag/skills/wcag .claude/skills/wcag && rm -rf skills-srcUse ~/.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/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .claude/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcagType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcag --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .agents/skills && cp -r skills-src/plugins/wcag/skills/wcag .agents/skills/wcag && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .agents/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcag --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/plugins/wcag/skills/wcag .cursor/skills/wcag && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .cursor/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git --path plugins/wcag/skills/wcag--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcag --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/plugins/wcag/skills/wcag .gemini/skills/wcag && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .gemini/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcagInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .github/skills && cp -r skills-src/plugins/wcag/skills/wcag .github/skills/wcag && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .github/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install Sushegaad/Claude-Skills-Governance-Risk-and-Compliance wcag --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/plugins/wcag/skills/wcag .opencode/skills/wcag && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "wcag" agent skill from https://github.com/Sushegaad/Claude-Skills-Governance-Risk-and-Compliance/tree/main/plugins/wcag/skills/wcag into .opencode/skills/wcag/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "wcag", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
wcag- GitHub stars
- 946
- Used in
- 1 other repo
- Token cost
- ~4.3k tokens
- SKILL.md length
- 2,148 words
- Files
- 2 (incl. references)
- Skills in repo
- 34
- Repo updated
- First seen
- Licence
- MIT
At a glance
Expert WCAG (Web Content Accessibility Guidelines) advisor covering WCAG 2.0, 2.1, and 2.2 — the W3C international accessibility standards.
- Works in 4 steps: Perceivable — Information must be… → Operable — Interface components must be… → Understandable — Content and operation… → …
- A user asks about WCAG success criteria
- SKILL.md covers How to Respond, WCAG Versions, The Four POUR Principles and WCAG Conformance Levels, plus 3 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Wcag is an agent skill from Sushegaad/Claude-Skills-Governance-Risk-and-Compliance. Expert WCAG (Web Content Accessibility Guidelines) advisor covering WCAG 2.0, 2.1, and 2.2 — the W3C international accessibility standards. Use this skill whenever a user asks about WCAG success criteria, conformance levels (A/AA/AAA), accessibility audits, POUR principles, accessibility statements, ARIA patterns, colour contrast, keyboard accessibility, screen reader compatibility, mobile accessibility, cognitive accessibility, WCAG 2.2 new criteria, WCAG 3.0 preview, legal requirements referencing WCAG (EN 301…
Its SKILL.md is about 4.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/criteria-detail.md`).
It sits in Frontend & Design, covering Accessibility. The repository describes itself as: Claude Skills for Governance, Risk, & Compliance (GRC): Expert-level compliance guidance for ISO 27001, SOC 2, FedRAMP, GDPR, HIPAA, NIST CSF, PCI DSS, EU AI Act, ISO 42001, ISO… The licence is MIT.
When your agent uses it
- A user asks about WCAG success criteria
- Conformance levels (A/AA/AAA)
- Accessibility audits
- POUR principles
Example prompts
- “t say”
- “/wcag”
Workflow steps
4 steps, taken from the step headings in SKILL.md.
What it can do on your machine
Read from SKILL.md and the folder at commit aab13e1. 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.
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
Wcag loads about 4.3k tokens when it runs, and up to ~12k if it reads all its reference files. Until then it costs about 176 tokens; SKILL.md has 2,148 words of instructions outside code blocks.
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 Sushegaad/Claude-Skills-Governance-Risk-and-Compliance at commit aab13e1, republished under its MIT licence (© Sushegaad). 2,148 words, ~4,280 tokens.
Download SKILL.mdSave it as
.claude/skills/wcag/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.- name
- wcag
- description
- Expert WCAG (Web Content Accessibility Guidelines) advisor covering WCAG 2.0, 2.1, and 2.2 — the W3C international accessibility standards. Use this skill whenever a user asks about WCAG success criteria, conformance levels (A/AA/AAA), accessibility audits, POUR principles, accessibility statements, ARIA patterns, colour contrast, keyboard accessibility, screen reader compatibility, mobile accessibility, cognitive accessibility, WCAG 2.2 new criteria, WCAG 3.0 preview, legal requirements referencing WCAG (EN 301 549, EAA, ADA, Section 508), or mapping WCAG to accessibility laws. Trigger for any web or digital content accessibility question — even if the user doesn't say "skill" or "WCAG".
Web Content Accessibility Guidelines (WCAG) Skill
Last verified: 2026-10-03
You are an expert advisor on the Web Content Accessibility Guidelines (WCAG) — the W3C international standard for digital accessibility, developed by the Web Accessibility Initiative (WAI). You help developers, designers, product owners, and compliance teams understand, audit, and implement WCAG across web, mobile, and digital content.
WCAG is the technical foundation for accessibility laws worldwide: the EU Web Accessibility Directive, the European Accessibility Act (EN 301 549), the US Section 508, the UK Equality Act, Australia's DDA, and ADA Title III web cases all reference WCAG conformance.
How to Respond
| Task | Output Format |
|---|---|
| Criterion explanation | Definition · Level (A/AA/AAA) · Why it matters · Common failures · Fix |
| Accessibility audit | Table: Criterion → Issue → Element/Location → Severity → Remediation |
| Conformance review | Summary: pass/fail per criterion, overall conformance level achieved |
| Gap assessment | Table: Criterion → Status (🔴/🟡/🟢) → Gap Notes → Priority |
| Accessibility statement | Structured document with conformance claim, known issues, contact |
| Code review | Annotated code with specific WCAG violations and corrected version |
| Legal mapping | Side-by-side: WCAG criterion → applicable law/standard |
| General question | Clear prose citing specific criterion numbers (e.g., SC 1.4.3) |
Always cite the criterion number and name (e.g., SC 2.4.7 Focus Visible) — never just the principle.
WCAG Versions
| Version | Status | Key Additions |
|---|---|---|
| WCAG 2.0 (2008) | W3C Recommendation | Foundational 61 criteria across 12 guidelines and 4 principles |
| WCAG 2.1 (2018) | W3C Recommendation — current minimum | +17 criteria: mobile, low vision, cognitive accessibility |
| WCAG 2.2 (Oct 2023) | W3C Recommendation — latest | +9 new criteria (SC 2.4.11–13, 2.5.7–8, 3.2.6, 3.3.7–8); removes 4.1.1 |
| WCAG 3.0 | W3C Working Draft (updated September 10, 2026) — not normative; Recommendation not expected before ~2029 | Six cumulative conformance tiers (avoid physical harm → foundational access → conformance → Bronze → Silver → Gold); requirements split core/supplemental/assertions with impact labels (Physical harm, Risk, Barrier, Friction). WCAG 2.2 remains the conformance target (Aug 2026 errata editorial only) |
Backwards compatibility: WCAG 2.2 is fully backwards-compatible. A site conforming to WCAG 2.2 AA also conforms to 2.1 AA and 2.0 AA. Most legal requirements today cite WCAG 2.1 AA; EN 301 549 (2021) references WCAG 2.1; the EAA compliance deadline of June 2025 uses EN 301 549 which maps to WCAG 2.1 AA.
The Four POUR Principles
1. Perceivable — Information must be presentable in ways users can perceive
| SC | Level | Requirement | Common Failures |
|---|---|---|---|
| 1.1.1 Non-text Content | A | Alt text for all images, icons, charts; empty alt for decorative | Missing alt; alt="image.png"; meaningful image alt="" |
| 1.2.1 Audio-only/Video-only | A | Transcript for audio; text alternative for silent video | No transcript for podcast; no description for infographic video |
| 1.2.2 Captions (Pre-recorded) | A | Synchronised captions for all pre-recorded video with audio | Auto-captions only; no captions for embedded YouTube |
| 1.2.3 Audio Description/Media Alt | A | Audio description or full text alternative for pre-recorded video | Video with on-screen actions not described in audio |
| 1.2.4 Captions (Live) | AA | Real-time captions for live video with audio | Live webinar or event with no live captions |
| 1.2.5 Audio Description (Pre-recorded) | AA | Audio description track for pre-recorded video | Tutorial video showing UI steps with no narration of what is shown |
| 1.3.1 Info and Relationships | A | Structure conveyed via markup (headings, labels, tables) | Styled divs as headings; unlabelled form fields; layout tables |
| 1.3.2 Meaningful Sequence | A | Reading order correct in DOM | CSS positioning creating visual order mismatched from DOM order |
| 1.3.3 Sensory Characteristics | A | Instructions not based solely on shape, colour, size, position | "Click the red button"; "see the box on the right" |
| 1.3.4 Orientation (2.1) | AA | Content not locked to a single orientation | Mobile page forces landscape; kiosk locked to portrait |
| 1.3.5 Identify Input Purpose (2.1) | AA | Autocomplete attributes on personal data fields | No autocomplete="name" or autocomplete="email" on personal data inputs |
| 1.4.1 Use of Colour | A | Colour not the only means of conveying information | Red/green status only; required fields by red colour alone |
| 1.4.2 Audio Control | A | Auto-playing audio can be stopped | Background music autoplays with no control |
| 1.4.3 Contrast (Minimum) | AA | Normal text: 4.5:1; large text: 3:1 | Grey text on white; light blue links on white |
| 1.4.4 Resize Text | AA | Text scalable to 200% without loss of content | Fixed-height containers clip text at 200% zoom |
| 1.4.5 Images of Text | AA | Text used rather than images of text | Button label is a PNG; styled quote is a JPG |
| 1.4.10 Reflow (2.1) | AA | Content reflowable at 320 CSS px width without horizontal scroll | Mobile layout breaks at 320px; content requires 2D scrolling |
| 1.4.11 Non-text Contrast (2.1) | AA | UI components and graphics: 3:1 contrast against adjacent colour | Light grey input border on white; low-contrast chart lines |
| 1.4.12 Text Spacing (2.1) | AA | No loss of content with specific text spacing overrides | Overflow hidden clips content when line-height: 2.5 applied |
| 1.4.13 Content on Hover or Focus (2.1) | AA | Hover/focus-triggered content: dismissable, hoverable, persistent | Tooltip disappears when cursor moves to it; not dismissable with Esc |
2. Operable — Interface components must be operable
| SC | Level | Requirement | Common Failures |
|---|---|---|---|
| 2.1.1 Keyboard | A | All functionality via keyboard; no keyboard trap | Mouse-only dropdowns; drag-and-drop with no keyboard alternative |
| 2.1.2 No Keyboard Trap | A | Focus can be moved away from any component | Modal with no close mechanism; widget trapping Tab permanently |
| 2.1.4 Character Key Shortcuts (2.1) | A | Single-character shortcuts can be turned off/remapped | Keyboard shortcut fires when user types in text field |
| 2.2.1 Timing Adjustable | A | Time limits adjustable, extendable, or removable | Session timeout with no warning or extension option |
| 2.2.2 Pause, Stop, Hide | A | Moving/blinking/scrolling content can be paused | Auto-rotating carousel with no pause button; parallax scrolling |
| 2.3.1 Three Flashes or Below | A | Nothing flashes more than 3 times/second | Animated GIF with fast flicker; strobe effect in video |
| 2.4.1 Bypass Blocks | A | Mechanism to skip repeated navigation | No skip link; no ARIA landmark navigation |
| 2.4.2 Page Titled | A | Pages have descriptive, unique titles | All pages titled "Home" or just the site name |
| 2.4.3 Focus Order | A | Focus order logical and meaningful | Tab order jumps around page; modal focus sent to wrong element |
| 2.4.4 Link Purpose (In Context) | A | Link purpose determinable from link text or context | "Click here", "Read more" with no accessible context |
| 2.4.5 Multiple Ways | AA | Multiple ways to locate pages | Site with only one navigation method and no search |
| 2.4.6 Headings and Labels | AA | Headings and labels are descriptive | Heading text "Section 1"; form label "Field 1" |
| 2.4.7 Focus Visible | AA | Keyboard focus indicator visible | CSS outline:none with no replacement; invisible focus on dark bg |
| 2.4.11 Focus Not Obscured (Minimum) (2.2) | AA | Focused element not entirely hidden by sticky header/footer | Sticky nav covers the focused element |
| 2.4.12 Focus Not Obscured (Enhanced) (2.2) | AAA | Focused element fully visible | Partially covered focused element |
| 2.4.13 Focus Appearance (2.2) | AAA | Focus indicator meets size and contrast requirements | Thin 1px focus ring with insufficient contrast |
| 2.5.1 Pointer Gestures (2.1) | A | Multipoint/path gestures have single-pointer alternative | Pinch-only zoom; swipe-only carousel navigation |
| 2.5.2 Pointer Cancellation (2.1) | A | Mousedown-triggered actions can be aborted | Button action fires on mousedown not mouseup |
| 2.5.3 Label in Name (2.1) | A | Accessible name contains visible label text | Button visually says "Submit" but aria-label="Send form" |
| 2.5.4 Motion Actuation (2.1) | A | Device motion alternatives exist; can be disabled | Shake-to-undo with no alternative; tilt navigation only |
| 2.5.7 Dragging Movements (2.2) | AA | Dragging operations have single-pointer alternative | Sortable list drag-only; slider with drag-only interaction |
| 2.5.8 Target Size (Minimum) (2.2) | AA | Target size ≥ 24×24 CSS px (or spacing compensates) | Icon buttons smaller than 24px with no adequate spacing |
Show full SKILL.md (940 more words)Show less
3. Understandable — Content and operation must be understandable
| SC | Level | Requirement | Common Failures |
|---|---|---|---|
| 3.1.1 Language of Page | A | Default human language programmatically determined | Missing lang attribute on <html>; lang="" |
| 3.1.2 Language of Parts | AA | Language of passages identified | French quote on English page with no lang="fr" |
| 3.2.1 On Focus | A | No context change when component receives focus | New window opens when element receives focus |
| 3.2.2 On Input | A | No unexpected context change when user inputs data | Form submits automatically when option selected |
| 3.2.3 Consistent Navigation | AA | Navigation consistent across pages | Navigation order changes between pages |
| 3.2.4 Consistent Identification | AA | Components with same function identified consistently | Search button labelled "Search" on one page, "Go" on another |
| 3.2.6 Consistent Help (2.2) | A | Help mechanisms in consistent location | Live chat and help link appear in different positions across pages |
| 3.3.1 Error Identification | A | Input errors identified and described | "Invalid input" with no description; visual-only error indicator |
| 3.3.2 Labels or Instructions | A | Labels or instructions for user input | Unlabelled form fields; no format hint for date (DD/MM/YYYY) |
| 3.3.3 Error Suggestion | AA | Correction suggestions provided | Error message says "wrong" without explaining correct format |
| 3.3.4 Error Prevention (Legal, Financial, Data) | AA | Legal/financial submissions: reversible, checked, or confirmable | One-click irreversible purchase with no confirmation step |
| 3.3.7 Redundant Entry (2.2) | A | Information already entered not re-requested in same session | Billing address required again on confirmation page |
| 3.3.8 Accessible Authentication (Minimum) (2.2) | AA | Cognitive function test not required for login unless alternatives exist | CAPTCHA with no alternative; memory puzzle required to log in |
4. Robust — Content must be interpreted by assistive technologies
| SC | Level | Requirement | Common Failures |
|---|---|---|---|
| 4.1.1 Parsing | A (removed in WCAG 2.2) | Valid markup (duplicate IDs, unclosed tags) | Still relevant for 2.0/2.1; duplicate IDs break AT |
| 4.1.2 Name, Role, Value | A | UI components have name, role, state/value | Custom widgets with no ARIA; toggle buttons missing aria-pressed |
| 4.1.3 Status Messages (2.1) | AA | Status messages programmatically determinable without focus | "Item added to cart" with no ARIA live region announcement |
WCAG Conformance Levels
| Level | Description | Legal relevance |
|---|---|---|
| A | Minimum — removes most critical barriers | Rarely sufficient alone for legal compliance |
| AA | Standard — the universal legal benchmark; removes significant barriers | Required by: Section 508, EU EAA/EN 301 549, UK GDS, ADA case law, AODA |
| AAA | Enhanced — removes remaining barriers for specific user groups | Not required as a blanket policy (WCAG itself notes full conformance may not be achievable for all content) |
Conformance claim: To claim WCAG X.X Level AA conformance, a web page must satisfy all Level A and Level AA success criteria with no exceptions (or document exceptions explicitly in an accessibility statement).
Common Workflows
Full Accessibility Audit (WCAG 2.1 AA)
- Automated scan — axe-core, Lighthouse, WAVE, or IBM Equal Access Checker. Catches ~30–40% of issues.
- Keyboard-only test — Tab / Shift-Tab / Enter / Space / Arrow keys through all interactive elements. Tests SC 2.1.1, 2.1.2, 2.4.3, 2.4.7.
- Screen reader test — NVDA + Chrome; JAWS + Chrome; VoiceOver + Safari (macOS); VoiceOver + Safari (iOS); TalkBack + Chrome (Android). Tests SC 1.1.1, 1.3.1, 4.1.2, and all informational criteria.
- Colour contrast — Colour Contrast Analyser or browser DevTools. Tests SC 1.4.3, 1.4.11.
- Zoom/reflow — Browser zoom to 400%; viewport at 320 CSS px. Tests SC 1.4.4, 1.4.10.
- Cognitive review — Consistent navigation, clear labels, error messages, no complex CAPTCHA. Tests SC 3.x criteria.
- Document issues — Per criterion, with element reference, severity, and remediation.
Accessibility Statement
A WCAG-conformant accessibility statement should include:
- The specific WCAG version and level claimed (e.g., "WCAG 2.1 Level AA")
- Scope: which pages or products the claim covers
- Known non-conformances: list each SC not met with an explanation
- Alternatives available: e.g., accessible PDF version, phone support
- Date of last assessment and assessment methodology
- Contact for feedback and accessibility requests
- Formal complaints procedure (required under EU Web Accessibility Directive)
ARIA Usage Principles
ARIA (Accessible Rich Internet Applications) adds semantics when HTML alone is insufficient. Key rules:
- No ARIA is better than bad ARIA — incorrect ARIA is worse than no ARIA
- First rule of ARIA: Use native HTML elements before adding ARIA roles
- Required attributes: every
rolehas required properties — e.g.,role="checkbox"requiresaria-checked - Interactive widgets must follow the ARIA Authoring Practices Guide (APG) keyboard patterns
- Use
aria-liveregions for dynamic content (status messages, loading states, errors)
Contrast Ratio Calculation
- Normal text (< 18pt regular or < 14pt bold): minimum 4.5:1
- Large text (≥ 18pt regular or ≥ 14pt bold): minimum 3:1
- UI components and graphics (SC 1.4.11): minimum 3:1
- Enhanced (AAA): normal text 7:1; large text 4.5:1
- Formula: (L1 + 0.05) / (L2 + 0.05) where L1 is the lighter and L2 the darker relative luminance
Global Legal Framework Mapping
| Law / Standard | Jurisdiction | WCAG Requirement |
|---|---|---|
| EN 301 549 (2021) | EU/EEA | WCAG 2.1 Level AA (Chapters 9–11) |
| European Accessibility Act (EAA) — Directive 2019/882 | EU | EN 301 549 → WCAG 2.1 AA; private sector deadline: June 28, 2025 |
| EU Web Accessibility Directive — 2016/2102 | EU public sector | WCAG 2.1 AA; in force since 2018–2020 |
| Section 508 (Revised 2018) | US federal sector | WCAG 2.0 AA (E205) |
| ADA Title III (case law) | US private sector | Courts increasingly apply WCAG 2.1 AA as the benchmark |
| UK Public Sector Accessibility Regulations 2018 | UK public sector | WCAG 2.1 AA |
| Equality Act 2010 | UK private sector | Reasonable adjustments — WCAG 2.1 AA widely used |
| AODA (WCAG Standard 2.0) | Ontario, Canada | WCAG 2.0 Level AA (large organisations since 2021) |
| DDA / Disability Discrimination Act | Australia | WCAG 2.1 AA (AHRC guidance) |
Reference Files
For deeper content, read as needed:
- references/criteria-detail.md — Full WCAG 2.2 success criteria with techniques, sufficient techniques, advisory techniques, and failure techniques for each AA criterion
This skill provides general compliance information, not legal advice. Verify current requirements against official sources; consult qualified counsel or an accredited assessor for decisions.
© Sushegaad, 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 1 other file (references) in plugins/wcag/skills/wcag of Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.
- SKILL.md
- references/criteria-detail.md
Open the folder on GitHubat commit aab13e1
Used in 1 other repository
We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in Sushegaad/Claude-Skills-Governance-Risk-and-Compliance, which our catalogue first saw on October 7, 2026.
Compare with similar skills
Wcag 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.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Wcag this skillSushegaad/Claude-Skills-Governance-Risk-and-Compliance | 946 | 1 repos | ~4.3k | Automated safety check: Pass | MIT | |
| Web Interface Guidelines Reviewervercel-labs/openreview | 1.7k | 97 repos | ~308 | Automated safety check: Pass | None | |
| Accessibility Reviewmarkmead/hyperui | 12k | 1 repos | ~1.1k | Automated safety check: Pass | MIT | |
| Web Animation DesignbaptisteArno/typebot.io | 11k | 2 repos | ~2.7k | Automated safety check: Pass | Custom licence | |
| Accessibility Fixeribelick/ui-skills | 9.6k | 4 repos | ~1.2k | Automated safety check: Pass | MIT | |
| Wcag Audit PatternsvmDeshpande/ai-agent-automation | 178 | 11 repos | ~610 | Automated safety check: Pass | Apache-2.0 |
Similar skills
- Official
Accessibility Review
markmead/hyperui
Run a WCAG 2.1 AA accessibility audit on a design or page. An agent skill from markmead/hyperui.
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.
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.
Wcag Audit Patterns
vmDeshpande/ai-agent-automation
Conduct WCAG 2.2 accessibility audits with automated testing, manual verification, and remediation guidance.
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.
More from Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
All 34 skills in this repoEu Cra
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
Expert EU Cyber Resilience Act (CRA) advisor for Regulation (EU) 2024/2847 — mandatory cybersecurity and vulnerability handling requirements for all products with digital elements (PDEs) sold in the…
Fedramp
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
Expert guidance for FedRAMP certification and compliance under CR26 (FedRAMP Consolidated Rules for 2026).
Gdpr Compliance
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
Expert GDPR compliance assistant covering all four core workflows: (1) auditing code and systems for GDPR violations, (2) drafting GDPR-compliant documents such as privacy policies, Data Processing…
Hipaa Compliance
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
Expert HIPAA compliance assistant for healthcare and software contexts.
Iso42001
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
Expert ISO 42001 AI Management System (AIMS) compliance advisor.
Nist 800 53
Sushegaad/Claude-Skills-Governance-Risk-and-Compliance
NIST SP 800-53 Rev 5 compliance advisor — all 20 control families (AC, AT, AU, CA, CM, CP, IA, IR, MA, MP, PE, PL, PM, PS, PT, RA, SA, SC, SI, SR), Low/Moderate/High baseline selection, FIPS 199/200…
Related
Categories
Questions about Wcag
What does Wcag do?
Expert WCAG (Web Content Accessibility Guidelines) advisor covering WCAG 2.0, 2.1, and 2.2 — the W3C international accessibility standards. Wcag is an agent skill from Sushegaad/Claude-Skills-Governance-Risk-and-Compliance.2 — the W3C international accessibility standards.
When should I use Wcag?
Wcag fits situations like: A user asks about WCAG success criteria; conformance levels (A/AA/AAA); accessibility audits; POUR principles.
How do I install Wcag in Claude Code?
Run `npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a claude-code`. Or copy the skill folder (plugins/wcag/skills/wcag in Sushegaad/Claude-Skills-Governance-Risk-and-Compliance) into .claude/skills/wcag in your project. Claude Code loads it when a task matches its description.
How do I install Wcag in Codex?
Run `npx skills add Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a codex`. Or copy the skill folder (plugins/wcag/skills/wcag in Sushegaad/Claude-Skills-Governance-Risk-and-Compliance) into .agents/skills/wcag in your project. Codex loads it when a task matches its description.
Can I use Wcag 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 Sushegaad/Claude-Skills-Governance-Risk-and-Compliance --skill wcag -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/wcag, .gemini/skills/wcag, .github/skills/wcag and .opencode/skills/wcag in your project.
What does Wcag need to run?
SKILL.md names no scripts, command-line tools or credentials: Wcag is instructions for the agent only.
Does Wcag 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 Wcag 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 Wcag use?
Wcag is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Wcag use?
About 4.3k tokens (SKILL.md is roughly 17k 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 7.2k tokens, read only when the agent opens those files.
What are the alternatives to Wcag?
Skills that share tags, products or a category with Wcag: 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 Wcag?
Sushegaad (a GitHub user) maintains it in Sushegaad/Claude-Skills-Governance-Risk-and-Compliance, which has 946 GitHub stars. The repository holds 34 skills in this directory. The repository was last updated on October 10, 2026.
Source: Sushegaad/Claude-Skills-Governance-Risk-and-Compliance on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.