Frontend Design

Create distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

When to Use

Trigger this skill when the user asks to:

• Build a UI component, page, or full frontend application
• Design or implement a frontend feature (navigation, forms, data tables, dashboards)
• Redesign an existing interface for better aesthetics or usability
• Convert a mockup, wireframe, or spec into working code

Instructions

1. Clarify the requirements (component type, framework, target audience, design constraints)
2. Propose an aesthetic direction and get user approval before coding
3. Implement the full working code with distinctive visual choices
4. Validate responsiveness and accessibility basics
5. Deliver the code with inline annotations for key design decisions