Generate Excalidraw architecture diagrams from codebase analysis. Use when user says "create an architecture diagram", "visualize the system design", "generate an excalidraw diagram", "draw the component structure", "create a visual representation of the codebase", or "diagram the data flow".
Generates Excalidraw architecture diagrams from codebase analysis when asked to visualize system design.
npx claudepluginhub uniswap/ai-toolkitThis skill is limited to using the following tools:
references/arrows.mdreferences/colors.mdreferences/examples.mdreferences/json-format.mdreferences/validation.mdGenerate valid .excalidraw JSON files representing system architecture from codebase analysis.
Works without existing diagrams, Terraform, or specific file types. Analyzes any codebase structure.
Four non-negotiable constraints:
No Diamond Shapes: Diamond arrow connections are broken in raw Excalidraw JSON. Use styled rectangles instead:
Label Architecture: The label property does NOT work in raw JSON. Every labeled element requires:
boundElements referencing the text elementcontainerId pointing to the shapeArrow Formatting: Multi-point arrows need:
"elbowed": true"roundness": null"roughness": 0Edge Positioning: Arrows must start/end at shape edges, not centers:
(x + width/2, y)(x + width/2, y + height)(x, y + height/2)(x + width, y + height/2)Extract from user's request:
scope: What part of codebase to diagram (full, specific module, etc.)type: Type of diagram (architecture, data flow, deployment, etc.)depth: Level of detail (high-level overview vs detailed)output: Output file path (defaults to ./architecture.excalidraw)Generate a valid .excalidraw JSON file with:
Before writing output, verify:
For detailed implementation guidance, see: