Description
frontend-a11y is an agent skill from the ECC collection by affaan-m, listed on skills.sh. It sets out accessibility patterns for React and Next.js interfaces and targets the problems that code reviews most often flag: form inputs without labels, incorrect ARIA attributes, interactive elements built from non-semantic tags, and keyboard navigation that does not work. It names missing htmlFor and id pairings and disconnected error messages as the most common form problems. The skill applies when building or reviewing form controls such as input, select and textarea, creating modals, dropdowns, tooltips and tabs, using div or span elements with click handlers, adding aria attributes, managing focus, and building components that must work with screen readers. It also responds to accessibility findings from review tools such as CodeRabbit or ESLint's accessibility rules. A skill is a SKILL.md file of instructions that an AI agent loads when a task calls for it. It is free and open source, and the skills.sh listing shows all three security audits passing.…
Highlights
- Form labels and error message linking
- Correct ARIA usage
- Semantic elements instead of click-handler divs
- Keyboard navigation and focus management
Ratings & Reviews
No ratings yet
Be the first to rate frontend-a11y.
People also visit
frontend-a11y FAQ
What does the frontend-a11y skill do?
It guides an agent in making React and Next.js components accessible, fixing labels, ARIA usage, semantics and keyboard support.
What is the most common form problem?
Missing htmlFor and id pairing, and error messages not connected to their fields.
Does it help with review tool findings?
Yes. The skill is used when accessibility feedback comes from tools such as CodeRabbit or ESLint a11y rules.
How do I install it?
Run: npx skills add https://github.com/affaan-m/ecc --skill frontend-a11y
Is it free?
Yes. It is free and open source.
Are there security findings?
The skills.sh listing shows Gen Agent Trust Hub, Socket and Snyk all passing.
What are the best frontend-a11y alternatives?
Popular alternatives to frontend-a11y include frontend-patterns, motion-advanced and motion-patterns. See all frontend-a11y alternatives