Setup & Installation
openclaw skills install @plgonzalezrx8/excalidraw-creator
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install excalidraw-creator
What This Skill Does
Generates hand-drawn style diagrams, flowcharts, and architecture visuals by writing Excalidraw JSON and rendering it to PNG via a local Node script. Supports rectangles, ellipses, diamonds, arrows, and text with configurable colors and roughness levels.
Produces Excalidraw PNGs programmatically without opening a browser or GUI, so diagram generation works inside any agent workflow.
When to use it
- Sketching system architecture during a planning session
- Creating flowcharts to document decision logic in code reviews
- Generating API flow diagrams for technical documentation
- Drawing UI wireframes for quick layout mockups
- Visualizing state machine transitions for a feature design
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: Create a flowchart for a user login process
AGENT
- 1Generate an Excalidraw element array with start rectangle, condition diamond, and process rectangle nodes
- 2Add arrow elements using from/to bindings between each node
- 3Write the JSON structure to /tmp/login.excalidraw
- 4Run node <skill_dir>/scripts/render.js /tmp/login.excalidraw /tmp/login.png
- 5Send login.png via message tool with filePath
OUTPUT
PNG image of the login flowchart with hand-drawn styling and color-coded nodes