excalidraw

Installation
SKILL.md

Generate an Excalidraw diagram from $ARGUMENTS.

Workflow

  1. Read $SKILL_DIR/references/EXCALIDRAW_GUIDE.md before doing layout work. For complex diagrams or exports, use the relevant sections instead of improvising structure.
  2. Classify the request: architecture, flowchart, sequence, hub-and-spoke, hierarchy, ER-style, swimlane, or freeform concept map.
  3. Choose a style mode:
    • professional by default for architecture, systems, APIs, workflows, and most technical diagrams
    • sketch only when the user explicitly asks for a whiteboard, brainstorm, rough draft, or hand-drawn look
  4. Perform arrow-path analysis before placing components. If return arrows or non-adjacent connections would cross intermediate nodes, switch to a bypass path or 2D layout.
  5. Generate the JSON with descriptive IDs, explicit text sizing and colors, bidirectional bindings, and containers that fully cover grouped children.
  6. Save the result as <descriptive-name>.excalidraw.json in the active directory.
  7. If the user asked for PNG or SVG, or a rendered preview would materially help, try an export:
    • SVG via Kroki when curl is available
    • PNG or SVG via excalidraw-brute-export-cli when the local CLI is available
    • If export tooling is unavailable, still deliver the JSON and explain what was missing
  8. Return the created file paths, chosen diagram type, chosen style mode, and export status.

Rules

Related skills

More from bahayonghang/my-claude-code-settings

Installs
46
GitHub Stars
14
First Seen
Jan 20, 2026