frontend-stacklisted

Router for the frontend design stack. Use at the start of any frontend UI task (build a page or component, redesign, pick a style or palette, polish, audit, animate, review UI) to decide which installed skill leads, which ones support, and which rule wins when the packs disagree. Also use when two design skills give contradicting advice.
JaimeJunr/claude-code-frontend-skills · ★ 1 · Web & Frontend · score 64

Install: claude install-skill JaimeJunr/claude-code-frontend-skills

# Frontend Stack router Five design packs are installed side by side. Each is good alone and each assumes it is the only one in the room. This skill decides who leads, so the agent loads one lead skill plus at most two supporting ones instead of five competing rulebooks. ## 1. Read the project first Before picking anything, look for what the project already decided: - `PRODUCT.md` / `DESIGN.md` at the repo root (Impeccable's context files) - an existing design system: tokens, `tailwind.config.*`, `components/ui/`, a component library in `package.json` - a brand guide the user pointed at If any of these exist, they outrank every skill below (see rule 1 of the precedence ladder). Your job becomes extending that system, not replacing it. ## 2. Pick the lead skill | The task is... | Lead | Support | |---|---|---| | New landing page, portfolio, marketing site | `taste:design-taste-frontend` | `frontend-design:frontend-design` for direction, `ui-ux-pro-max:ui-ux-pro-max` for palette/font lookup | | New product UI: dashboard, settings, tables, multi-step flows | `frontend-design:frontend-design` | `ui-ux-pro-max:ui-ux-pro-max` (stack + UX guidelines), `impeccable:impeccable` for `harden` at the end | | "Plan it before coding", discovery, UX flow | `impeccable:impeccable` (`shape`) | - | | Set up design context for a repo | `impeccable:impeccable` (`init`, then `document`) | - | | Redesign an existing site or app | `impeccable:impeccable` (`critique` then `audit`) | `taste:r