What problem does it solve? AI-generated web designs tend to cluster around a few generic looks—cream backgrounds with serif displays, dark themes with acid accents, or broadsheet layouts—regardless of the subject. This Skill provides a structured design methodology that grounds every palette, typography, and layout choice in the specific brief, producing interfaces with a deliberate visual identity rather than templated defaults. ## Core Features & Use Cases - Brief-Grounded Design Planning: Builds a compact token system covering color (4-6 named hex values), typography (display, body, and utility faces), layout concepts with ASCII wireframes, and a single signature element. - Two-Pass Critique Workflow: Brainstorms a design plan, reviews it against the brief to eliminate generic defaults, then builds code strictly from the revised plan. - Interface Copywriting Guidance: Applies the same intentionality to UI copy—active voice, consistent action naming, and error/empty states that direct users—treating words as design material. - Use Case: When asked to build a landing page for a fitness coaching app, use this Skill to derive a palette and type pairing from the subject's world, define one memorable signature element, and avoid the default hero-with-gradient template. ## Quick Start Design a landing page for my product using the frontend-design skill, starting with a design plan before writing any code.
