What problem does it solve? AI-generated interfaces often look generic and templated, relying on overused fonts, default color palettes, and repetitive card layouts. This Skill guides the creation of distinctive, production-grade web interfaces that avoid recognizable AI design patterns. ## Core Features & Use Cases - Design Direction Guidance: Commits to a bold aesthetic direction covering typography, color, layout, motion, and interaction before writing code. - In-Depth Reference Guides: Provides detailed references on typography, color and contrast (OKLCH), spatial design, motion, interaction, responsive design, and UX writing. - Anti-Pattern Detection: Includes explicit DON'T guidelines that flag common AI-generated design fingerprints like gradient text, glassmorphism overuse, and identical card grids. - Use Case: When asked to build a landing page or dashboard, the Skill produces working HTML/CSS with fluid type scales, tinted neutral palettes, staggered entrance animations, and accessible focus states instead of generic template output. ## Quick Start Ask the AI to build a web page, component, or application interface and it will apply these design principles to generate polished, distinctive frontend code.
