designagent

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

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.

1 skill · 1 command · 1 MCP server

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

BRAND.md: your brand's identity and mascot as a Claude Code plugin. Interview to a BRAND.md, generate a monoline SVG mascot, and seed VOICE.md and DESIGN.md.

1 skill · 1 command

Set up a project for design work in Claude Code: scaffold DESIGN.md (tokens), CLAUDE.md (design intelligence), and DECISIONS.md, tailored to your stack. The fastest on-ramp for designers new to Claude Code.

1 skill · 1 command