component-polish
CommunityElevate UI components to professional, polished quality.
Authorbrunophelipegusmao
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill streamlines the process of refining UI components, ensuring they are consistent, visually appealing, and ready for production deployment.
Core Features & Use Cases
- Design Consistency Checks: Verify color schemes, spacing, typography, and borders adhere to design standards.
- Visual Enhancements: Add refined shadows, subtle borders, and gradient accents for a sophisticated appearance.
- Spacing and Alignment: Optimize spacing for optical alignment and consistent rhythm across components.
- State Coverage: Ensure all component states (hover, focus, disabled, loading, error, success) are styled and tested.
- Accessibility Improvements: Incorporate ARIA attributes and keyboard navigation to improve usability for all users.
- Skeleton Loading States: Implement loading placeholders for better user experience during data fetching.
- Error States: Style and implement error message components with appropriate visual cues.
- Final QA: Validate responsive behavior, accessibility, and visual fidelity across browsers.
Quick Start
Use the component-polish skill to review and optimize your UI component code according to design and accessibility standards.
Dependency Matrix
Required Modules
None requiredComponents
referencesassets
💻 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: component-polish Download link: https://github.com/brunophelipegusmao/management-process-web/archive/main.zip#component-polish 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.