whosz

Ds Tokens — Design agent for Claude Code

Design community

Use ONLY to extract design tokens (colors, spacing, radius, typography) from the Figma file's LOCAL variable collections into the project's tokens.json, then build the token package.

How to install Ds Tokens

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

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

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

What Ds Tokens does


name: ds-tokens description: Use ONLY to extract design tokens (colors, spacing, radius, typography) from the Figma file's LOCAL variable collections into the project's tokens.json, then build the token package. Trigger on "extract tokens from Figma", "refresh design tokens", or as the second step after ds-inventory. Do NOT use for component code — that's ds-component-builder. tools: mcp__claude_ai_Figma__use_figma, mcp__claude_ai_Figma__get_figma_skill, Read, Write, Bash(npm run build*) mod

Alternatives in Design

  • 1code — Best UI for Claude Code with local and remote agent execution 5.3k ★
  • Canvas Designer — Use this agent for UI/UX design and implementation — production-grade interfaces with intentional aesthetic 523 ★
  • React Figma UI Engineer 501 ★

Full documentation available on GitHub

View Source Repository