Does the build match the design? Screenshots your running UI, diffs it against the Figma frame / DESIGN.md, and reports layout, spacing, color, and type drift by severity.
Plugin design-qa from marketplace designagent in sherizan/designagent. Commands read from the repo's manifest — 28 days ago.
This plugin runs code on your machine — it starts local MCP servers. The exact commands are listed below; read them before installing.
design-qaCheck whether a built UI actually matches its design. Use when the user asks to QA a screen, "does this match the design / Figma", find visual or design drift, review the implementation against the spec, or check design fidelity before handoff. Screenshots the running app, diffs it against the desig
/design-qa:design-qaQA a running UI against its design — screenshot it, diff against the Figma frame / DESIGN.md, report layout/spacing/color/type drift by severity.
playwrightruns: npx -y @playwright/mcp@latest --headless
AI design review for Claude Code: connects PRD, research, Figma, and analytics to review design intent (not pixels) and surface gaps before handoff or launch. Reads and annotates Figma through the DesignAgent bridge. Run /new, /review, /annotate.
1 skill · 3 commands · 6 agents · 1 MCP server
Claude Code's live two-way bridge to Figma: read, build, and edit the canvas in real time, then build production UI from a design-system-faithful DESIGN.md.
3 skills · 1 MCP server · hooks
Extract your design tokens from code (colors, spacing, type, radius) with deterministic clustering and hardcoded-value drift detection, and keep DESIGN.md in sync.
3 skills · 1 command
DESIGN.md: scaffold and sync your design system, then lint the code against its own rules (borders vs shadows, off-grid spacing, extra typefaces, over-cap weights).
1 skill · 2 commands
VOICE.md: proofread copy against a house voice and strip the AI tells (em dashes, hype, filler), keeping commands, ids, and code literally unchanged.
1 skill · 2 commands
Generate self-contained, brand-aware background effects (animated WebGL shader, dot-grid, or ASCII art) recolored from your DESIGN.md, with reduced-motion and fallbacks baked in.
1 skill · 1 command
Collection of example skills demonstrating various capabilities including skill creation, MCP building, visual design, algorithmic art, internal communications, web testing, artifact building, Slack GIFs, and theme styling
19 skills
Comprehensive PR review agents specializing in comments, tests, error handling, type design, code quality, and code simplification
1 command · 6 agents
Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.
7 skills
tasteskill 2.5.1: professional company websites at the figma.com and x.ai level, with one section per screen, real photographs, real product UI, effects kept for tech and gaming pages, and a real-browser checker and finish gate.
1 skill
Design fluency for frontend development. 1 skill with 24 commands (/impeccable polish, /impeccable audit, /impeccable critique, etc.) and curated anti-pattern detection.
1 skill · 4 agents · hooks
Build, preview, and test UI components with Storybook.
7 skills
This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.