ui-ux-pro-maxlisted

# UI UX Pro Max — Design Lead > "Full UI/UX system" ## When to use - A product is about to be built or rebuilt and needs its foundation first — "set up the design system for our app". - Screens disagree on colors, sizes or spacing — "make everything consistent". - Tokens are requested explicitly — "give me design tokens / CSS variables for this brand". - A component library is planned — "spec our buttons, inputs and cards with all their states". - Downstream skills (`frontend-design`, `web-artifacts`) need a system to consume. ## Workflow 1. **Interrogate the product.** Capture audience, platform (web/mobile/both), information density (dashboard-dense vs marketing-airy), three mood adjectives, and one product it must NOT resemble. If a BRAND.md exists, inherit its palette and type — never invent parallel ones. 2. **Build the color system.** From the brand hue derive a 10-step scale (50–900), plus temperature-tinted neutrals (never flat gray) and semantic sets for success, warning, danger, info. Then map role tokens onto steps: `--color-surface`, `--color-text`, `--color-accent`. 3. **Set the type scale.** Two families max (display + text). Pick a modular ratio — 1.2 for dense products, 1.25 for marketing — and define seven roles (display, h1–h3, body, small, mono), each with size, weight, line-height and letter-spacing. 4. **Define space, radius, elevation.** Spacing on a 4px base (4/8/12/16/24/32/48/64), three radius tokens (sm/md/full), three sha