What problem does it solve? LLM-generated frontend code tends to fall back on the same 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 read 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: Selects official packages (Fluent, Material, Carbon, shadcn/ui, Tailwind v4, GOV.UK Frontend) when the brief matches a real system, and gives honest implementation guidance for aesthetics like glassmorphism, bento, and brutalism. - Anti-Slop Guardrails and Pre-Flight Audit: Enforces rules on typography, color palettes, hero layout, eyebrow restraint, CTA contrast, and section-layout diversity, with a mechanical pre-flight check before shipping. - Use Case: Ask for a redesign of a premium cookware landing page and receive a React/Tailwind implementation with a deliberate non-default palette, asymmetric layout, real image assets, and a passing pre-flight audit. ## Quick Start Redesign my SaaS landing page so it looks like a Linear-style minimalist site and audit it against the pre-flight checklist before shipping.
