whosz

Ds Component Builder — Design agent for Claude Code

Design community

Use to build or fix 1-5 components from the project's Figma file into the UI package.

How to install Ds Component Builder

Installs to ~/.claude/agents/whosz-ds-agent-ds-component-builder.md

Terminal
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/whosz/ds-agent/HEAD/agents/ds-component-builder.md -o ~/.claude/agents/whosz-ds-agent-ds-component-builder.md

Restart Claude Code, or start a new session, for it to be picked up.

What Ds Component Builder does


name: ds-component-builder description: Use to build or fix 1-5 components from the project's Figma file into the UI package. Trigger on "build from Figma", "restyle ", or when running a batch from docs/inventory.json. Requires the inventory and token package to exist first (run ds-inventory / ds-tokens if missing). Do NOT use for tokens or inventory — those are separate agents. Do NOT use for full pages or templates. tools: Skill, mcp__claude_ai_Figma__get_design_context, mcp__claude

Alternatives in Design

  • Shep Storybook Story Creator — Creates ONE Storybook story file colocated with a web UI component under src/presentation/web/components/, cov 247 ★
  • Design Builder — Use this agent for building production-ready prototypes and implementations from design specs — assembling com 240 ★
  • UI Agent — Use when the user needs UI/UX design decisions, component architecture, layout, typography, color system, or v 118 ★

Full documentation available on GitHub

View Source Repository