Frontend Design Skill

This skill provides two distinct workflows for creating production-grade frontend interfaces:

Scenario Detector

Answer this question: Is there an existing codebase with components, pages, or a design system?

✅ YES → Existing Codebase (Most Common)

Use this workflow: EXISTING-CODEBASE-CHECKLIST.md

Purpose: Enforce design language consistency by analyzing existing patterns before implementation.

When to use:

• Adding components to existing project
• Creating new pages in existing app
• Modifying UI in established codebase
• Working with design system