What problem does it solve? LLM-generated frontend code tends to fall back on templated aesthetics: AI-purple gradients, centered heroes, generic card grids, and default fonts. This Skill forces the agent to read the brief first, infer the right design direction, and ship interfaces that do not look machine-generated. ## Core Features & Use Cases - Brief Inference and Design Read: Analyzes page kind, vibe words, references, audience, and constraints, then declares a one-line design direction before writing any code. - Three-Dial Configuration: Tunes DESIGN_VARIANCE, MOTION_INTENSITY, and VISUAL_DENSITY based on the brief, with presets for SaaS landings, portfolios, editorial sites, and public-sector services. - Design System Mapping: Routes briefs to official packages (Fluent, Material 3, Carbon, Polaris, shadcn/ui, Tailwind v4) instead of hand-rolled CSS, with honesty rules for aesthetic-only directions. - Mandatory Pre-Flight Audits: Enforces hard layout rules covering hero fit, eyebrow restraint, CTA contrast, palette locking, bento rhythm, and zigzag caps before shipping. - Use Case: Ask for a redesign of a B2B SaaS landing page and receive a Linear-style minimalist build using Tailwind v4, Motion, Geist typography, and real generated imagery, with every section passing the layout audit. ## Quick Start Redesign my SaaS landing page to feel like Linear, using Tailwind and Motion, and audit the layout before shipping.
