By dnlopes
UI development toolkit with headless browser automation and shadcn/ui component documentation
npx claudepluginhub dnlopes/claude-code-plugins --plugin ui-devUse when troubleshooting UI issues, testing UI changes, writing bash-based e2e tests, or automating browser interactions. Provides headless browser CLI with accessibility snapshots and deterministic refs for AI-friendly element selection.
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
A marketplace of production-ready plugins extending Claude Code CLI with specialized agents for code review, documentation, git workflows, UI development, and architectural governance.
| Plugin | Version | Purpose |
|---|---|---|
dev-toolkit | 1.0.0 | Build system skills (Taskfile) |
docs-manager | 4.3.0 | Documentation generation with staleness tracking |
git-workflow | 3.0.2 | Commit and PR workflows with Angular convention |
governor | 3.1.0 | Architectural tenet management and verification |
review-toolkit | 4.0.0 | Multi-agent code review |
ui-dev | 2.1.0 | UI development with browser automation and shadcn/ui |
Clone this repository to your Claude Code plugins directory:
git clone <repository-url> ~/.claude/plugins/claude-code-plugins
No build step required. Plugins auto-discover via marketplace.json.
# Generate repository documentation
/docs-manager:onboard
# Create git commits with Angular convention
/git-workflow:commit
# Discover and create architectural tenets
/governor:setup
# Multi-agent pull request review
/review-toolkit:review-pr
claude-code-plugins/
├── .claude-plugin/
│ └── marketplace.json # Registry of all plugins
├── <plugin>/
│ ├── .claude-plugin/
│ │ └── plugin.json # Plugin metadata
│ ├── commands/ # Workflow orchestrators
│ ├── skills/ # Declarative knowledge
│ └── agents/ # Autonomous workers
├── docs/ # Repository documentation
└── .github/workflows/ # CI/CD pipelines
<type>(<scope>): <description>marketplace.json and plugin.jsonSee Development for detailed contribution guidelines.
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples.
External network access
Connects to servers outside your machine
Share bugs, ideas, or general feedback.
Use this agent when creating user interfaces, designing components, building design systems, or improving visual aesthetics. This agent specializes in creating beautiful, functional interfaces that can be implemented quickly within 6-day sprints. Examples:\n\n<example>\nContext: Starting a new app or feature design
Workflow skills and agents: code-walk-thru, log-work, make-issue-spec skills; ui-tester agent for browser-based UI validation
Agents specialized in frontend development, UI design, and presentation engineering. Focuses on visual design, user experience, and interaction patterns.
Reliable automation, in-depth debugging, and performance analysis in Chrome using Chrome DevTools and Puppeteer
Manus-style persistent markdown files for planning, progress tracking, and knowledge storage. Works with Claude Code, Kiro, Clawd CLI, Gemini CLI, Cursor, Continue, Hermes, and 17+ AI coding assistants. Now with Arabic, German, Spanish, and Chinese (Simplified & Traditional) support.