Tldraw Agent — Development skill for Claude Code

🎨 tldraw-agent

Generate diagrams from text. Works anywhere.

npx tldraw-agent draw "User → API → Database"

Install

npm install -g @joelhooks/tldraw-agent

Usage

CLI

tldraw-agent draw "microservices architecture with load balancer"
tldraw-agent draw "signup flow" --format svg -o signup.svg

Library

import { TldrawAgent } from '@joelhooks/tldraw-agent'

const agent = new TldrawAgent()
const { path } = await agent.draw({ prompt: 'system diagram' })

MCP

{
  "mcpServers": {
    "tldraw": { "command": "npx", "args": ["@joelhooks/tldraw-agent", "--mcp"] }
  }
}

Features

• 🖼️ PNG/SVG export
• 🤖 LLM-powered layout (Claude, GPT)
• 📐 Architecture, flowcharts, entity diagrams
• 🔌 Works as CLI, library, MCP tool, or agent skill

Environment

export AI_GATEWAY_API_KEY=...  # Vercel/Cloudflare AI Gateway key

License

MIT