← ClaudeAtlas

excalidrawlisted

Create diagrams using Excalidraw JSON or hand-crafted SVG. Use when the user asks to create diagrams, flowcharts, architecture diagrams, RTL micro-architecture, wireframes, mind maps, ERDs, sequence diagrams, or any visual drawings. Generates `.excalidraw` JSON or `.svg` files.
rockyco/excalidraw-skill · ★ 7 · Data & Documents · score 58
Install: claude install-skill rockyco/excalidraw-skill
# Excalidraw Diagram Creation Generate `.excalidraw` files as JSON using the Write tool. No scripts or executables needed. ## File Wrapper Every `.excalidraw` file uses this structure: ```json { "type": "excalidraw", "version": 2, "source": "https://excalidraw.com", "elements": [], "appState": { "viewBackgroundColor": "#ffffff", "gridSize": null }, "files": {} } ``` - `elements`: Array of all shapes, text, arrows, and lines - `appState`: Canvas settings (background color, grid) - `files`: Image data (only needed for embedded images) ## Element Types | Type | Shape | Use For | |------|-------|---------| | `rectangle` | Box | Processes, services, containers | | `ellipse` | Oval | Start/end points, databases | | `diamond` | Diamond | Decisions, conditions | | `text` | Text | Labels, descriptions | | `arrow` | Arrow | Connections, data flow | | `line` | Line | Lifelines, boundaries | | `freedraw` | Freehand | Annotations | | `frame` | Frame | Grouping container | ## Minimal Element Templates ### Rectangle ```json { "type": "rectangle", "id": "rect-1", "x": 100, "y": 100, "width": 160, "height": 80, "angle": 0, "strokeColor": "#1e1e1e", "backgroundColor": "#a5d8ff", "fillStyle": "solid", "strokeWidth": 2, "strokeStyle": "solid", "roughness": 1, "opacity": 100, "seed": 1001, "version": 1, "versionNonce": 1001, "isDeleted": false, "groupIds": [], "boundElements": [ { "id": "text-1", "type": "text" } ], "link