building-frontend-components
CommunityBuild accessible, production-ready UI components.
AuthorSentry01
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill streamlines the creation of accessible, production-ready frontend components, ensuring adherence to best practices and design system compliance from the outset.
Core Features & Use Cases
- Accessibility First: Enforces ARIA standards, keyboard navigation, and focus management.
- Design System Integration: Guides users to check for and utilize existing design system components and tokens.
- Component States: Ensures all necessary states (loading, error, empty, disabled) are considered.
- Use Case: When building a new modal dialog in React, this skill will first prompt you to check for existing modal components, then guide you through implementing focus trapping, escape key handling, and proper ARIA attributes before any JSX is written.
Quick Start
Use the building-frontend-components skill to create a new accessible button component for a React project.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: building-frontend-components Download link: https://github.com/Sentry01/copilot-cli-skills/archive/main.zip#building-frontend-components Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.