What problem does it solve? Starting a new project's UI without a design system leads to inconsistent typography, ad-hoc colors, and generic-looking interfaces. This Skill acts as a design consultant that understands your product, researches competitors, and produces a coherent design system saved as DESIGN.md, your project's design source of truth. ## Core Features & Use Cases - Product context gathering: Reads your README, package.json, and codebase structure to infer what you're building, then confirms direction through a conversational Q&A. - Competitive design research: Uses WebSearch and an optional headless browse binary to screenshot and analyze top products in your space, synthesizing table-stakes patterns, trends, and first-principles departures. - Complete design system output: Proposes aesthetic direction, typography, color palette, layout, spacing, and motion, then writes DESIGN.md and generates font/color preview pages or AI mockups when the design binary is available. - Use Case: You're starting a new SaaS dashboard with no brand guidelines. Run the consultation, answer a few questions about your users, and receive a DESIGN.md with specific fonts, hex colors, and layout rules plus a visual preview page. ## Quick Start Ask the assistant to create a design system and DESIGN.md for your new project, and answer the product context questions it asks.
