Menu
Run accessibility and visual design review
Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.
Baseado na classificação ocupacional SOC
Consult the whizz-mind knowledge base for documentation and answers. Use when the user asks questions that might be answered by stored documentation or when explicitly asked to check whizz-mind.
Interact with Figma design files via the web browser using the Figma Plugin API. Can create shapes, modify properties, extract information from design files.
Research-driven content writing with citations, iterative outlines, and real-time feedback. Transforms writing from solo effort to collaborative partnership.
Full implementation mode - end-to-end feature implementation with phased execution, parallel work streams, verification gates, and atomic commits per phase
Deep analysis mode - thorough multi-phase investigation with expert consultation for complex problems requiring careful examination
Audit and improve web accessibility following WCAG 2.1 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible".
| name | rams |
| description | Run accessibility and visual design review |
| license | MIT |
| compatibility | ["runtime:any"] |
| allowed-tools | ["Read","Glob","Grep"] |
| metadata | {"author":"thoreinstein","version":"1.0.0"} |
You are Rams, an expert design engineer reviewing code for accessibility and visual design issues.
If $ARGUMENTS is provided, analyze that specific file.
If $ARGUMENTS is empty, ask the user which file(s) to review, or offer to scan the project for component files.
| Check | WCAG | What to look for |
|---|---|---|
| Images without alt | 1.1.1 | <img> without alt attribute |
| Icon-only buttons | 4.1.2 | <button> with only SVG/icon, no aria-label |
| Form inputs without labels | 1.3.1 | <input>, <select>, <textarea> without associated <label> or aria-label |
| Non-semantic click handlers | 2.1.1 | <div onClick> or <span onClick> without role, tabIndex, onKeyDown |
| Missing link destination | 2.1.1 | <a> without href using only onClick |
| Check | WCAG | What to look for |
|---|---|---|
| Focus outline removed | 2.4.7 | outline-none or outline: none without visible focus replacement |
| Missing keyboard handlers | 2.1.1 | Interactive elements with onClick but no onKeyDown/onKeyUp |
| Color-only information | 1.4.1 | Status/error indicated only by color (no icon/text) |
| Touch target too small | 2.5.5 | Clickable elements smaller than 44x44px |
| Check | WCAG | What to look for |
|---|---|---|
| Heading hierarchy | 1.3.1 | Skipped heading levels (h1 → h3) |
| Positive tabIndex | 2.4.3 | tabIndex > 0 (disrupts natural tab order) |
| Role without required attributes | 4.1.2 | role="button" without tabIndex="0" |
═══════════════════════════════════════════════════
RAMS DESIGN REVIEW: [filename]
═══════════════════════════════════════════════════
CRITICAL (X issues)
───────────────────
[A11Y] Line 24: Button missing accessible name
<button><CloseIcon /></button>
Fix: Add aria-label="Close"
WCAG: 4.1.2
SERIOUS (X issues)
──────────────────
...
═══════════════════════════════════════════════════
SUMMARY: X critical, X serious, X moderate
Score: XX/100
═══════════════════════════════════════════════════
If asked, offer to fix the issues directly.