excalidraw-diagram

Installation
Summary

Generate Excalidraw diagram JSON files that argue visually, not just display information.

  • Supports simple conceptual diagrams (abstract shapes, mental models) and comprehensive technical diagrams (concrete examples, code snippets, real data formats)
  • Includes a research mandate for technical diagrams: look up actual specs, event names, APIs, and data formats before designing
  • Provides a visual pattern library (fan-out, convergence, timelines, trees, cycles) where shape structure mirrors conceptual behavior
  • Requires mandatory render-and-validate loop: generate JSON, render to PNG, audit against design intent, fix visual defects, repeat until correct
  • Uses semantic color coding from a centralized palette file; defaults to free-floating text with containers only when they carry meaning
SKILL.md

Excalidraw Diagram Creator

Generate .excalidraw JSON files that argue visually, not just display information.

Setup: If the user asks you to set up this skill (renderer, dependencies, etc.), see README.md for instructions.

Customization

All colors and brand-specific styles live in one file: references/color-palette.md. Read it before generating any diagram and use it as the single source of truth for all color choices — shape fills, strokes, text colors, evidence artifact backgrounds, everything.

To make this skill produce diagrams in your own brand style, edit color-palette.md. Everything else in this file is universal design methodology and Excalidraw best practices.


Core Philosophy

Diagrams should ARGUE, not DISPLAY.

A diagram isn't formatted text. It's a visual argument that shows relationships, causality, and flow that words alone can't express. The shape should BE the meaning.

Installs
4.5K
GitHub Stars
3.1K
First Seen
Mar 2, 2026