ui-design plugin
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
How to install the ui-design plugin
Run both commands inside Claude Code. The first adds the marketplace once; the second installs the plugin.
/plugin marketplace add wshobson/agents
/plugin install ui-design@claude-code-workflowsWhat's inside ui-design
16 parts read from the plugin's own files.
Commands 4
Run as /ui-design:name- /ui-design:accessibility-audit
No description in the file.
- /ui-design:create-component
No description in the file.
- /ui-design:design-review
No description in the file.
- /ui-design:design-system-setup
No description in the file.
Agents 3
Call as @agent-ui-design:name- @agent-ui-design:accessibility-expert
No description in the file.
- @agent-ui-design:design-system-architect
No description in the file.
- @agent-ui-design:ui-designer
No description in the file.
Skills 9
Claude loads it when the task matches- accessibility-compliance
No description in the file.
- design-system-patterns
No description in the file.
- interaction-design
No description in the file.
- mobile-android-design
No description in the file.
- mobile-ios-design
No description in the file.
- react-native-design
No description in the file.
- responsive-design
No description in the file.
- visual-design-foundations
No description in the file.
- web-component-design
No description in the file.
Using ui-design in Claude Code
Type a command in a Claude Code session:
/ui-design:accessibility-audit
/ui-design:create-component
/ui-design:design-reviewAsk for an agent by name:
@agent-ui-design:accessibility-expert
@agent-ui-design:design-system-architectSkills need no command. Claude reads them when your request matches what they describe.
Update, turn off or remove
- Update the plugin (shell)
- claude plugin update ui-design@claude-code-workflows
- Refresh the marketplace
- /plugin marketplace update claude-code-workflows
- Turn it off for now
- /plugin disable ui-design@claude-code-workflows
- Remove it
- /plugin uninstall ui-design@claude-code-workflows
ui-design plugin questions
How do I install the ui-design plugin?
In Claude Code run /plugin marketplace add wshobson/agents, then /plugin install ui-design@claude-code-workflows.
What does the ui-design plugin include?
ui-design bundles 4 commands, 3 agents, 9 skills.
What commands does the ui-design plugin add?
It adds /ui-design:accessibility-audit, /ui-design:create-component, /ui-design:design-review, /ui-design:design-system-setup. Run them in Claude Code with the plugin prefix, for example /ui-design:accessibility-audit.
Which agents come with ui-design?
accessibility-expert, design-system-architect, ui-designer. Call one with @agent-ui-design:accessibility-expert.
How do I update or remove the ui-design plugin?
Update it with claude plugin update ui-design@claude-code-workflows in your shell, or from the Installed tab of /plugin. Remove it with /plugin uninstall ui-design@claude-code-workflows.