design-taste-frontend

Start by inferring the design direction from the brief: page kind, audience, vibe words, and references. Then set variance, motion, and density dials, pick an appropriate design system or aesthetic family, and audit the output against banned defaults like purple gradients and centered heroes.

For indie and small-team SaaS builds, Tailwind v4 utilities with a dark variant are the default. For enterprise contexts, use official packages like Fluent UI for Microsoft-style products, Carbon for IBM-style B2B, or shadcn/ui when you want to own the component code.

Yes, it defaults to React or Next.js with Server Components. Interactive components using Motion, scroll listeners, or pointer physics must be isolated client leaves with 'use client', while server components render static layouts only.

Serif is discouraged as a default and only acceptable when the brand brief names a serif font or the aesthetic is genuinely editorial, luxury, or heritage. For creative agencies, portfolios, and modern brands, default to sans-serif display fonts like Geist Display or Cabinet Grotesk.

LLMs default to recognizable patterns: AI-purple gradients, centered heroes, three equal feature cards, Inter font, eyebrows above every section, and zigzag image-text layouts. Avoiding these requires explicit anti-default rules, palette rotation, and mechanical pre-flight checks.

It targets landing pages, portfolios, and redesigns only, not dashboards, data tables, or multi-step product UI. It also requires real image assets for quality output, so without an image-generation tool or stock sources it leaves labeled placeholder slots instead.