excalidrawlisted

# Excalidraw Diagram Generator Generate architecture diagrams as `.excalidraw` files directly from codebase analysis, with optional export to PNG and SVG. --- ## Quick Start **User just asks:** ``` "Generate an architecture diagram for this project" "Create an excalidraw diagram of the system" "Visualize this codebase as an excalidraw file" ``` **Claude Code will:** 1. Analyze the codebase (any language/framework) 2. Identify components, services, databases, APIs 3. Map relationships and data flows 4. Generate valid `.excalidraw` JSON with dynamic IDs and labels 5. Optionally export to PNG and/or SVG using Playwright **No prerequisites:** Works without existing diagrams, Terraform, or specific file types. --- ## Critical Rules ### 1. NEVER Use Diamond Shapes Diamond arrow connections are broken in raw Excalidraw JSON. Use styled rectangles instead: | Semantic Meaning | Rectangle Style | | ---------------- | -------------------------------------------- | | Orchestrator/Hub | Coral (`#ffa8a8`/`#c92a2a`) + strokeWidth: 3 | | Decision Point | Orange (`#ffd8a8`/`#e8590c`) + dashed stroke | ### 2. Labels Require TWO Elements The `label` property does NOT work in raw JSON. Every labeled shape needs: ```json // 1. Shape with boundElements reference { "id": "my-box", "type": "rectangle", "boundElements": [{ "type": "text", "id": "my-box-text" }] } // 2. Separate text element with containerId { "id": "my-box-text", "type": "text