What problem does it solve? AI-generated web interfaces often look generic, relying on overused fonts, cliched color schemes, and predictable layouts. This Skill guides the creation of distinctive, production-grade frontend code with a clear aesthetic direction instead of cookie-cutter output. ## Core Features & Use Cases - Aesthetic Direction: Commits to a bold, intentional design concept (brutalist, editorial, retro-futuristic, minimal, maximalist, etc.) before writing any code. - Design Guidelines: Applies concrete rules for typography pairing, cohesive color themes via CSS variables, motion and micro-interactions, spatial composition, and textured backgrounds. - Working Code Output: Produces functional HTML/CSS/JS, React, or Vue implementations matched in complexity to the chosen aesthetic vision. - Use Case: Ask for a landing page for a coffee brand, and receive a polished page with a distinctive display font, warm editorial palette, staggered load animations, and an asymmetric layout rather than a generic template. ## Quick Start Build a landing page for a specialty coffee brand with a bold editorial aesthetic, distinctive typography, and scroll-triggered animations.
