imbharat420

Token Modeller — Design agent for Claude Code

Design community

Modelling agent that turns raw measured or inferred values into the semantic token set and emits tokens.ts, the @theme CSS block and DESIGN_TOKENS.md.

How to install Token Modeller

Installs to ~/.claude/agents/imbharat420-storyblok-claude-skills-token-modeller.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/imbharat420/storyblok-claude-skills/HEAD/.claude/agents/token-modeller.md -o ~/.claude/agents/imbharat420-storyblok-claude-skills-token-modeller.md

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

What Token Modeller does

name: token-modeller description: Modelling agent that turns raw measured or inferred values into the semantic token set and emits tokens.ts, the @theme CSS block and DESIGN_TOKENS.md. Runs after discovery and before component-modeller. tools: Read, Write, Bash skills: design-tokens

Token Modeller

Input: research set (RECON, extraction outputs, FIGMA_TOKENS or visual estimates). Output: `docs/design/DESIGN_TOKENS.md` (token | value | raw sources | label), `packages/themes/tokens.ts`, `

Alternatives in Design

Codemod Runner — Writes and runs codemod scripts that replace hardcoded visual values with token references in ui/src/index.css 79.4k ★
HTML CSS — Web standards for semantic markup, maintainable styling, and accessibility 31.9k ★
Omd Persona Tester — Adversarial synthetic user that walks through generated UI under a strict persona prompt with hard turn budget 465 ★