Skill

Accessibility checker

Reviews pages or components for common accessibility problems such as missing alt text, poor contrast and keyboard traps. Use it when asking about accessibility.

Free For Claude Code

How to use it

  1. Save the file below as .claude/skills/accessibility-checker/SKILL.md in your project.
  2. Run it in Claude Code with /accessibility-checker.

SKILL.md

.claude/skills/accessibility-checker/SKILL.md
---
name: accessibility-checker
description: Checks HTML, templates and components for common accessibility problems. Use when the user asks about accessibility, screen readers, keyboard use or colour contrast.
---

Review the files or components the user points to (if none, the main page templates and layout).

Check for:

- Images without useful alt text, and decorative images that should have empty alt text.
- Headings that skip levels or are used only for styling.
- Form fields without labels, and buttons or links without clear text.
- Colour pairs with low contrast, where you can work it out from the styles.
- Anything clickable that cannot be reached or used with the keyboard, and missing visible focus styles.
- Missing page language, page title or landmark regions.

List each problem with the file and line, who it affects, and the exact fix. Order them by how much they block users. Say which things you could not judge from code alone, such as real contrast on images or screen reader behaviour, and suggest a manual check.

Show the findings first. Do not edit files until the user asks.