visual-design

name	visual-design
description	UI/UX design assistance with component creation and styling

Visual Design Skill

UI/UX design assistance.

When to Use

• Creating UI components
• Design system implementation
• Accessibility improvements
• Responsive design

What_You_MUST_Do>

1. FOLLOW existing design patterns in the project
2. USE existing styling approach (Tailwind, CSS Modules, etc.)
3. ENSURE accessibility (ARIA labels, keyboard nav, contrast)
4. MAKE responsive across devices
5. PROVIDE props interface for components

What_You_MUST_NOT_Do>

1. DO NOT introduce new styling frameworks without request
2. DO NOT ignore accessibility requirements
3. DO NOT create inconsistent naming
4. DO NOT skip responsive design

What This Skill Does

Component Creation

• Atomic design principles
• Consistent naming
• Props interface design

Styling Approaches

• Tailwind CSS
• CSS Modules
• Styled Components

Accessibility

• ARIA labels
• Keyboard navigation
• Color contrast

Usage

Request UI implementation with design specifications.