What problem does it solve? AI-generated frontend code tends to look templated and generic, repeating the same gradients, centered heroes, and card grids. This Skill forces the agent to read the brief first, infer the right design direction, and apply disciplined layout, typography, and color rules so landing pages, portfolios, and redesigns do not look like default LLM output. ## 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 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 and Anti-Slop Rules: Selects official design systems (Fluent, Material, Carbon, shadcn/ui, Tailwind v4) when appropriate and enforces hard pre-flight checks on hero layout, eyebrows, CTAs, contrast, and palette consistency. - Use Case: Ask the agent to redesign a B2B SaaS landing page; it declares a Linear-style minimalist read, sets dials to 5/3/3, builds with Tailwind v4 and Geist, and passes a mechanical pre-flight audit before shipping. ## Quick Start Redesign my SaaS landing page so it looks like a deliberate Linear-style design instead of a generic AI template.
