design-taste-frontend

This is an "anti-slop" frontend design skill for building landing pages, portfolios, and redesigns that do not look templated or AI-generated. It addresses a specific failure mode: LLMs jump to a default aesthetic (purple gradients, centered hero over dark mesh, three equal feature cards, generic glassmorphism, Inter plus slate-900) instead of reading the actual brief. The skill forces a discipline of inferring the design direction before writing any code, declaring a one-line "Design Read" that states the page kind, audience, vibe, and target design system.

Its workflow is built around three tunable dials — DESIGN_VARIANCE, MOTION_INTENSITY, and VISUAL_DENSITY — with inference tables and use-case presets that map signals like "minimalist," "premium consumer," or "public-sector" onto concrete dial values. It then maps briefs to real, official design systems where appropriate (Fluent UI, Material 3, Carbon, Polaris, Atlaskit, Primer, GOV.UK Frontend, USWDS) rather than inventing CSS or faking a system, and it enforces an audit-first approach on redesigns plus a strict pre-flight check and explicit anti-default rules. Craft dimensions it calls out include typography, color, anti-AI-slop patterns, and animation discipline.

Target users are designers, frontend developers, and agents producing marketing sites, portfolios, and redesigns who want polished, context-appropriate, responsive HTML output. It is explicitly not for dashboards, data tables, or multi-step product UI. As a purely advisory design-guidance skill with no executable code, it is benign.