Help us improve
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
By michelve
Cowork-compatible skills, agents, hooks, and MCP servers for shipping design-to-production React 19 apps — Figma-to-code translation, accessibility enforcement, and development best practices for designers and engineers.
npx claudepluginhub michelve/hugin-marketplace --plugin hugin-coworkAnalyze blind comparison results to understand WHY the winner won and generate improvement suggestions for skill evaluation.
Automatically resolve TypeScript compilation and build errors systematically. Use when fixing build errors, TypeScript errors, compilation failures, tsc errors, or when the build is broken and needs to be fixed.
Semantic code review using project-specific rules
Review recently written code for best practices, architectural consistency, and system integration. Use when reviewing code, checking implementations, after completing significant code changes, or when asking for a code review.
Refactor code for better organization, cleaner architecture, and improved maintainability. Use when reorganizing code, cleaning up messy files, extracting components, splitting large files, or improving code structure.
This skill should be used when the user asks about accessibility concerns, including WCAG compliance (any success criterion including SC 1.3.5 autocomplete, SC 2.4.11 focus obscured), ARIA roles and attributes, screen reader behavior, axe-core or WAVE audit failures, color and non-text contrast, keyboard navigation, focus trapping and management, skip links, touch targets, VPAT reports, or accessible form patterns. Also triggers when the user asks whether a UI library such as shadcn or Radix handles keyboard interactions — but only if the question is specifically about accessibility behavior, not general usage.
This skill should be used when the user asks to write an ADR, create an ADR, document this decision, ADR for X, architecture decision record for X, record this decision, or document the decision to use X. It writes, validates, and commits Architecture Decision Records in MADR 4.0.0 format. Do NOT trigger on lookup or audit tasks such as what ADR covers X or check ADR compliance.
This skill provides automatic semantic code review triggered after file modifications. It is hook-driven — logging file changes via PostToolUse and running the automatic-code-reviewer agent on Stop. It should not be invoked directly by the user; it is triggered automatically by lifecycle hooks.
This skill should be used when the user asks to code connect, connect this component to code, connect Figma to code, map this component, link component to code, create code connect mapping, or add code connect. It connects Figma design components to code components using Code Connect.
This skill should be used when the user asks to visualize components, show component dependencies, dependency graph, component map, or what depends on what. It generates interactive HTML dependency graphs for React components.
Matches all tools
Hooks run on every tool call, not just specific ones
Executes bash commands
Hook triggers when Bash tool is used
Share bugs, ideas, or general feedback.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Shared Claude Code plugin for frontend teams, including frontend skills, subagents, hooks, and MCP integration for Figma/Sketch/MasterGo/Pixso/墨刀/摹客. All reports auto-saved as Markdown files.
Convert Figma designs and screenshots into production-ready code components with accessibility built-in
Premium design patterns, UX research skills, and user journey mapping for modern web applications.
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Frontend component development with accessibility and responsive design
Design Director for complete apps, sites, and SaaS. Multi-stack support (React/shadcn, Laravel/Livewire Flux, Swift/SwiftUI). Identity System, page layouts, motion system, palette generator, design audit. Anti-AI-Slop, WCAG 2.2, Gemini Design MCP.
Ship design-to-production React 19 apps with Claude Code — Figma-to-code translation, automated code reviews, architecture guardrails, and accessibility enforcement for designers and engineers.
Modifies files
Hook triggers on file write and edit operations
Modifies files
Hook triggers on file write and edit operations
External network access
Connects to servers outside your machine
External network access
Connects to servers outside your machine
Uses power tools
Uses Bash, Write, or Edit tools
Uses power tools
Uses Bash, Write, or Edit tools
Share bugs, ideas, or general feedback.
A Cowork plugin that helps product designers and engineers ship design-to-production React apps — translating Figma mockups into accessible, production-ready components with best-practice enforcement for React 19, TypeScript, Tailwind CSS v4, and shadcn/ui.
22 skills, 13 agents, 6 MCP servers, and 8 lifecycle hooks covering the full stack: React 19, TypeScript, Express, Prisma, Tailwind CSS v4, shadcn/ui, Figma integration, accessibility, and testing.
Ported from hugin-v0 (the Claude Code CLI plugin).
| Skill | Description |
|---|---|
| accessibility | WCAG 2.1 AA — keyboard nav, ARIA, focus management, color contrast |
| adr-writer | Write Architecture Decision Records in MADR 4.0.0 format |
| automatic-code-review | Hook-driven semantic code review after file modifications |
| code-connect-components | Connect Figma components to code via Code Connect |
| component-visualizer | Generate interactive HTML dependency graphs for React components |
| create-design-system-rules | Generate project-specific design system Figma-to-code rules |
| create-tasks | Break PRDs into well-formed, INVEST-compliant tasks |
| figma | Fetch design context, screenshots, variables from Figma MCP |
| figma-implement-design | Translate Figma nodes into production-ready code |
| miro-mcp | Create diagrams, tables, docs on Miro boards via MCP |
| nodejs | Node.js backend patterns — async/await, middleware, layered architecture |
| playwright-skill | Browser automation, e2e testing, UI validation |
| prisma | Prisma Client queries, schema, migrations, transactions |
| react | React 19 hooks, Suspense, lazy loading, TypeScript patterns |
| react-best-practices | Vercel Engineering performance optimization guidelines |
| route-tester | HTTP API route testing, auth strategies, integration tests |
| setup | Verify environment, API keys, and tool availability |
| shadcn | shadcn/ui component management — add, search, fix, compose |
| tailwindcss | Tailwind CSS v4 utility-first styling, responsive, dark mode |
| task-check | Verify task completion against acceptance criteria |
| web-design-guidelines | UI accessibility and design review |
| writing-tests | Test naming, assertions, edge case coverage (BugMagnet-based) |
| Agent | Model | Description |
|---|---|---|
| principal-engineer | opus | First-principles engineering analysis and architectural reviews |
| auto-error-resolver | sonnet | Systematically resolve TypeScript/build errors |
| code-architecture-reviewer | opus | Review code for best practices and architectural consistency |
| code-refactor-master | sonnet | Refactor for better organization and cleaner architecture |
| documentation-architect | sonnet | Create and update comprehensive documentation |
| plan-reviewer | opus | Review development plans before implementation |
| refactor-planner | sonnet | Analyze code structure and create refactoring plans |
| web-research-specialist | haiku | Research solutions and best practices online |
| automatic-code-reviewer | haiku | Semantic code review using project-specific rules |
| task-check | haiku | Verify task completion before finishing work |
| analyzer | sonnet | Analyze blind comparison results for skill evaluation |
| comparator | sonnet | Blind comparison of two outputs for skill evaluation |
| grader | sonnet | Evaluate expectations against execution transcripts |