excalidraw-diagram

excalidraw diagram

coleam00 4.2k ↓ 6.6k updated 5mo ago
Claude Code
View source ↗

What it does

  • Explaining a mental model or philosophy
  • The audience doesn't need technical specifics
  • The concept IS the abstraction (e.g., "separation of concerns")
  • Diagramming a real system, protocol, or architecture
  • The diagram will be used to teach or explain (e.g., YouTube video)
  • The audience needs to understand what things actually look like
  • You're showing how multiple technologies integrate

Requirements & configuration

  • Before designing, determine what level of detail this diagram needs:
  • The audience doesn't need technical specifics
  • The audience needs to understand what things actually look like
  • Simple vs Comprehensive (Know Which You Need)
  • Not every piece of text needs a shape around it. Default to free-floating text. Add containers only when they serve a purpose.

Configuration: README

Derived from the skill's own SKILL.md documentation · extracted 2026-07-23

excalidraw diagram

Source

Repository: https://github.com/coleam00/excalidraw-diagram-skill

excalidraw-diagram FAQ

What does the excalidraw-diagram skill do?

Create Excalidraw diagram JSON files that make visual arguments. Use when the user wants to visualize workflows, architectures, or concepts. Explaining a mental model or philosophy The audience doesn't need technical specifics

What does excalidraw-diagram require?

Before designing, determine what level of detail this diagram needs: The audience doesn't need technical specifics The audience needs to understand what things actually look like Simple vs Comprehensive (Know Which You Need) Not every piece of text needs a shape around it. Default to free-floating text. Add containers only when they serve a purpose. Configuration keys: README.

How do I install excalidraw-diagram?

Run: npx -y skills add https://github.com/coleam00/excalidraw-diagram-skill --skill excalidraw-diagram --agent claude-code — the source lives at github.com/coleam00/excalidraw-diagram-skill.

Maintain excalidraw-diagram?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

excalidraw-diagram on getagentictools
[![excalidraw-diagram on getagentictools](https://getagentictools.com/badge/skills/coleam00-excalidraw-diagram-skill-excalidraw-diagram.svg)](https://getagentictools.com/skills/coleam00-excalidraw-diagram-skill-excalidraw-diagram?ref=badge)
npx agentictools info skills/coleam00-excalidraw-diagram-skill-excalidraw-diagram

The second line is the CLI lookup for this page — handy in READMEs and docs.