Frontend Design Skill

This skill guides creation of distinctive, production-grade frontend interfaces. It automatically detects the project's existing design system and frontend framework, respects them first, then channels creativity through composition, layout, and motion.

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

Step 1: Codebase Context Discovery (MANDATORY)

Before writing any code or choosing any aesthetic direction, scan the codebase. This step is non-negotiable and runs every time.

What to Detect