What problem does it solve? Building web interfaces often results in generic, cookie-cutter designs with overused fonts, cliched color schemes, and predictable layouts. This Skill guides the creation of distinctive, production-grade frontend code that commits to a bold aesthetic direction instead of defaulting to generic AI-generated aesthetics. ## Core Features & Use Cases - Aesthetic Direction Planning: Commits to a clear conceptual direction (brutalist, editorial, retro-futuristic, luxury, etc.) before writing any code, based on purpose, audience, and constraints. - Design System Guidance: Provides concrete rules for typography pairing, cohesive color themes with CSS variables, motion and micro-interactions, spatial composition, and atmospheric backgrounds. - Production Code Output: Implements working HTML/CSS/JS, React, or Vue interfaces that are functional, visually striking, and meticulously refined. - Use Case: Ask for a landing page for a coffee brand, and receive a complete page with a distinctive display font, warm editorial palette, staggered scroll-triggered reveals, and asymmetric layout rather than a generic template. ## Quick Start Ask the assistant to build a landing page, dashboard, or React component for your project and describe the audience and mood you want.
