What problem does it solve? AI-generated frontend interfaces tend to fall into recognizable template patterns—cream backgrounds with serif display fonts, uniform rounded SaaS cards, generic fade-in animations. This Skill helps you produce distinctive, intentional visual designs that match the product's theme instead of defaulting to generic output. ## Core Features & Use Cases - Theme-First Visual Direction: Derives color, typography, and layout choices from the product's industry and content rather than from templates, with a checklist of common generative design clichés to avoid. - Two-Round Design Process: Brainstorm a compact token system (4-6 named hex colors, font roles, ASCII layout sketch), then self-review against the brief for uniqueness before writing any code. - Quality Floor Checks: Covers responsive behavior, keyboard focus visibility, reduced-motion compliance, contrast, loading/empty/error states, and copywriting discipline. - Use Case: When asked to build a landing page or dashboard UI, use this Skill to define a deliberate visual identity, audit the proposal for template defaults, and implement with disciplined restraint. ## Quick Start Use the frontend-design skill to design a landing page for my product with a distinctive visual direction instead of a generic template look.
