What problem does it solve? AI-generated frontend code often looks generic, with overused fonts, cliched purple gradients, and cookie-cutter layouts. This Skill guides the creation of distinctive, production-grade web interfaces that commit to a bold, intentional aesthetic direction instead of defaulting to generic AI design patterns. ## Core Features & Use Cases - Aesthetic Direction Framework: Commits to a clear conceptual direction (brutalist, editorial, retro-futuristic, maximalist, etc.) before writing any code. - Design Guidelines: Covers typography pairing, cohesive color themes via CSS variables, motion and micro-interactions, spatial composition, and atmospheric backgrounds. - Anti-Generic Rules: Explicitly avoids overused fonts (Inter, Roboto, Arial), cliched color schemes, and predictable component patterns. - Use Case: Ask for a landing page for a coffee brand, and receive a complete HTML/CSS/JS or React page with a distinctive editorial layout, characterful font pairing, staggered load animations, and textured backgrounds rather than a template-looking result. ## Quick Start Build a landing page for a specialty coffee brand with a bold editorial aesthetic using the frontend-design skill.
