frontend-design

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

Reference Repositories

• shadcn-svelte — Port of shadcn/ui for Svelte with Bits UI primitives
• shadcn-svelte-extras — Additional components for shadcn-svelte
• Svelte — Svelte 5 framework

The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.

When to Apply This Skill

Use this pattern when you need to:

• Build or redesign a frontend component, page, or full interface.
• Define and execute a strong aesthetic direction before coding.
• Produce polished UI with intentional typography, color, motion, and composition.
• Avoid generic, repetitive AI-style design choices.
• Match implementation complexity to the chosen visual direction.