UI/UX Pro Max
Design, build, or review user-facing web/mobile interfaces with searchable
style, color, typography, product, UX, chart, and stack guidance.
Trigger
Use for UI structure, visual design, components, interaction, accessibility,
responsive behavior, animation, design systems, or interface quality. Skip pure
backend, data, infrastructure, and non-visual work.
Entry point
uv run --script <skill-dir>/scripts/cli.py ...
MUST use the bundled CLI; MUST NOT invoke internal Python files directly.
Workflow
Inspect the product type, audience, desired tone, platform, project stack, and
existing interface and design-system state.
Start with a design-system search:
uv run --script <skill-dir>/scripts/cli.py "<product> <industry> <tone>" --design-system -p "<project>"
Add --domain <domain> for targeted evidence or --stack <stack> for
implementation guidance. Use --variance, --motion, and --density only
with --design-system.
Add --persist only when the user wants design-system/MASTER.md; add
--page <name> for an override.
You MUST reuse established tokens and components before hardcoding values or adding
variants.
For Web Interface Guidelines compliance audits, fetch upstream rules when needed:
https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md
and report findings in terse file:line format.
Implement the smallest coherent increment, then validate accessibility, touch,
responsive layout, performance, contrast, reduced motion, and error states.
Validation failure? You MUST inspect, fix, and retry before continuing
Core constraints
- MUST preserve visible focus, keyboard access, semantic labels, and zoom
- MUST NOT use color alone for meaning or emoji as structural icons
- MUST meet WCAG contrast and platform touch-target minimums
- MUST reserve async/media space, avoid horizontal overflow, and respect
prefers-reduced-motion.
- SHOULD use one icon family, semantic tokens, a consistent spacing/type scale,
and one primary action per screen.
Required follow-up reads
| Need |
Read |
When |
| Full rules, domain map, examples, and delivery checklists |
references/design-guide.md |
Broad design/review work or a rule needs detail |
| Live searchable design data |
data/*.csv, data/stacks/*.csv via CLI |
CLI search only; MUST NOT load all CSVs into context |
| Internal search/generation behavior |
scripts/search.py, scripts/core.py, scripts/design_system.py |
Debugging the bundled CLI |
1---2name: ui-ux-pro-max3description: Use when designing, building, reviewing, or improving web or mobile UI, UX, layout, accessibility, or components.4license: AGPL-3.0-or-later5---67# UI/UX Pro Max89Design, build, or review user-facing web/mobile interfaces with searchable10style, color, typography, product, UX, chart, and stack guidance.1112## Trigger1314Use for UI structure, visual design, components, interaction, accessibility,15responsive behavior, animation, design systems, or interface quality. Skip pure16backend, data, infrastructure, and non-visual work.1718## Entry point1920```text21uv run --script <skill-dir>/scripts/cli.py ...22```2324MUST use the bundled CLI; MUST NOT invoke internal Python files directly.2526## Workflow27281. Inspect the product type, audience, desired tone, platform, project stack, and29 existing interface and design-system state.302. Start with a design-system search:3132 ```text33 uv run --script <skill-dir>/scripts/cli.py "<product> <industry> <tone>" --design-system -p "<project>"34 ```35363. Add `--domain <domain>` for targeted evidence or `--stack <stack>` for37 implementation guidance. Use `--variance`, `--motion`, and `--density` only38 with `--design-system`.394. Add `--persist` only when the user wants `design-system/MASTER.md`; add40 `--page <name>` for an override.415. You MUST reuse established tokens and components before hardcoding values or adding42 variants.436. For Web Interface Guidelines compliance audits, fetch upstream rules when needed:44 `https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md`45 and report findings in terse `file:line` format.467. Implement the smallest coherent increment, then validate accessibility, touch,47 responsive layout, performance, contrast, reduced motion, and error states.488. Validation failure? You MUST inspect, fix, and retry before continuing4950## Core constraints5152- MUST preserve visible focus, keyboard access, semantic labels, and zoom53- MUST NOT use color alone for meaning or emoji as structural icons54- MUST meet WCAG contrast and platform touch-target minimums55- MUST reserve async/media space, avoid horizontal overflow, and respect56 `prefers-reduced-motion`.57- SHOULD use one icon family, semantic tokens, a consistent spacing/type scale,58 and one primary action per screen.5960## Required follow-up reads6162| Need | Read | When |63| --- | --- | --- |64| Full rules, domain map, examples, and delivery checklists | `references/design-guide.md` | Broad design/review work or a rule needs detail |65| Live searchable design data | `data/*.csv`, `data/stacks/*.csv` via CLI | CLI search only; MUST NOT load all CSVs into context |66| Internal search/generation behavior | `scripts/search.py`, `scripts/core.py`, `scripts/design_system.py` | Debugging the bundled CLI |
anntnzrb