Skip to content
Development
Skill

/ui-ux-pro-max

Use when planning, building, designing, code review, refactor, fixing, improving, optimizing, enhancing, or checking UI/UX work. Covers product patterns, landing pages, chart choices, visual styles, palettes, typography, UX rules, and 9 stacks (React, Next.js, Vue, Svelte,

From plugin
spellbook
25893 skills10 agents
Install
$ npx -y skills add majiayu000/spellbook --skill ui-ux-pro-max --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/ui-ux-pro-max

Context preview

The summary Claude sees to decide when to auto-load this skill.

Use when planning, building, designing, code review, refactor, fixing, improving, optimizing, enhancing, or checking UI/UX work. Covers product patterns, landing pages, chart choices, visual styles, palettes, typography, UX rules, and 9 stacks (React, Next.js, Vue, Svelte,

SKILL.md

ui-ux-pro-max.SKILL.md
name: ui-ux-pro-max
description: "Use when planning, building, designing, code review, refactor, fixing, improving, optimizing, enhancing, or checking UI/UX work. Covers product patterns, landing pages, chart choices, visual styles, palettes, typography, UX rules, and 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient."

UI/UX Pro Max

Use this skill for high-rigor UI/UX design guidance, design-system generation, stack-specific implementation hints, and pre-delivery review.

Routing

  • Start here to confirm scope, safety boundaries, and the minimum workflow.
  • Load `references/full-guide.md` before executing detailed commands, applying templates, or relying on examples from this skill.
  • Keep the work limited to the user-requested target; do not add adjacent improvements unless the user asks.

Quick Workflow

1. Confirm the target, available context, constraints, and done-when signal. 2. Read the relevant section of `references/full-guide.md` for task-specific details. 3. Execute the smallest reversible action that satisfies the request. 4. Verify accessibility, responsiveness, interaction states, visual hierarchy, and the concrete design-system artifacts requested by the user. 5. Report changed files, commands run, evidence collected, and any remaining risk.

References

  • `references/full-guide.md` - complete command patterns, examples, checklists, and edge cases.
Read more
Ships withspellbook

Cross-runtime skills for Claude Code, Codex, and multi-agent workflows.

Get the whole plugin

Other skills on spellbook.