design-taste-frontend

Load this Skill into your agent so it reads the brief first, declares a design direction, and applies explicit bans on AI defaults like purple gradients, centered heroes, and three equal feature cards. Three dials control variance, motion, and density per project.

Each dial is a 1-10 scale set after the brief inference step. Variance controls layout experimentation, motion controls animation depth, and density controls information per viewport. The baseline is 8/6/4, with lookup tables mapping brief signals like minimalist or playful to specific values.

Yes. The rules target design intent rather than a single framework API, though the default stack is React or Next.js with Tailwind v4 and Motion for animation. Real design systems like Fluent, Carbon, or shadcn/ui are used when the brief calls for them.

Yes. Redesign briefs trigger an audit-first workflow that treats existing brand assets as starting material. Preserve mode matches current variance and density, while overhaul mode raises both dials by two.

Inter and AI-purple gradients are the most common LLM defaults, making outputs instantly recognizable as machine-generated. The skill bans them as defaults but allows them when the brief explicitly requests that aesthetic, executed with intent.

The skill falls back to real photography sources like picsum.photos with descriptive seeds, or leaves clearly labeled placeholder slots and tells the user exactly which images to provide. Hand-rolled SVG illustrations and fake screenshot divs are discouraged.