What problem does it solve? LLMs tend to produce generic, clichéd frontend code with centered layouts, purple gradients, Inter fonts, and static components. This Skill overrides those default biases with metric-based design rules, strict component architecture, and performance guardrails so generated UI code looks intentionally designed rather than auto-generated. ## Core Features & Use Cases - Bias-Corrected Design Rules: Enforces deterministic typography, single-accent color calibration, asymmetric layouts, and bans common AI tells like neon glows, pure black, and generic placeholder data. - Configurable Design Dials: Uses DESIGN_VARIANCE, MOTION_INTENSITY, and VISUAL_DENSITY baselines (8/6/4) that adapt dynamically to user requests to control layout asymmetry, animation richness, and information density. - Motion & Bento Architecture: Specifies Framer Motion spring physics, perpetual micro-interactions, staggered orchestration, and a five-card Bento grid paradigm for SaaS dashboards, with strict Client Component isolation for performance. - Use Case: Ask for a SaaS analytics dashboard and receive a Next.js implementation with a Bento grid, infinitely looping status indicators, skeleton loading states, and mobile-safe responsive collapse instead of a generic three-card layout. ## Quick Start Use the design-taste-frontend skill to build a modern SaaS dashboard landing page in Next.js with Tailwind and Framer Motion.
