tldraw-skill

# tldraw Whiteboard Diagrams ## Overview Generate modern whiteboard-style diagrams as `.tldr` JSON files and export to PNG/SVG using `@kitschpatrol/tldraw-cli`. tldraw produces clean hand-drawn aesthetic diagrams with rich shape libraries and smooth arrow routing — well-suited for casual or whiteboard-style visualizations. **Format:** `.tldr` JSON **Export:** PNG, SVG (via `@kitschpatrol/tldraw-cli`) **Aesthetic:** Hand-drawn whiteboard style by default; switchable to clean fonts via `font` prop. ## When to Use **Explicit triggers:** user says "diagram", "flowchart", "draw", "visualize", "whiteboard diagram", "tldraw diagram", "architecture diagram", "sketch this out". **Proactive triggers:** - Explaining a system with 3+ interacting components - Describing a multi-step process, data flow, or pipeline - Showing relationships between services/modules - Architecture overviews, sequence flows, decision trees, ML model layers **Skip when:** a simple list or table suffices, the user wants a polished business-presentation diagram (prefer drawio-skill), or the user is in a quick Q&A flow. **When NOT to use it — route elsewhere:** - Logos / solid-color graphics / filled icons: tldraw has **no opaque fill** (`solid` = light tint; white-on-dark can't be reproduced) → use the **drawio** skill or the original vector file. - Precise vector geometry or strict (hollow-arrow) UML → **drawio** (or **plantuml** for UML). - Auto-layout of many nodes → **mermaid** (tldraw needs manual co...