# Excalidraw Diagram Skill

## Docs

- [Introduction](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/introduction.md): A coding agent skill that generates beautiful Excalidraw diagrams from natural language descriptions. Not just boxes-and-arrows — diagrams that argue visually.
- [Installation](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/installation.md): Install the Excalidraw Diagram Skill and set up the render pipeline for visual validation.
- [Quickstart](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/quickstart.md): Create your first Excalidraw diagram in under 2 minutes using natural language descriptions.
- [Core Philosophy](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/concepts/philosophy.md): Diagrams should argue, not display. Learn the foundational principles that make visual arguments effective.
- [Depth Assessment](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/concepts/depth-assessment.md): Before designing, determine what level of detail your diagram needs. Simple vs Comprehensive.
- [Evidence Artifacts](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/concepts/evidence-artifacts.md): Concrete examples that prove your diagram is accurate and help viewers learn. Essential for technical diagrams.
- [Multi-Zoom Architecture](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/concepts/multi-zoom.md): Comprehensive diagrams operate at multiple zoom levels simultaneously — like a map showing both country borders and street names.
- [Design Process](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/methodology/design-process.md): The complete step-by-step workflow for creating effective Excalidraw diagrams that argue visually
- [Visual Pattern Library](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/methodology/pattern-library.md): A comprehensive catalog of visual patterns for mapping concepts to shapes, including ASCII diagrams and usage guidelines
- [Shape Meaning](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/methodology/shape-meaning.md): Guidelines for choosing shapes based on semantic purpose, and rules for when to use containers vs free-floating text
- [Layout Principles](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/methodology/layout-principles.md): Guidelines for hierarchy, whitespace, flow direction, and connections that create clear, scannable diagrams
- [Creating Diagrams](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/guides/creating-diagrams.md): End-to-end workflow from concept to finished diagram
- [Large Diagrams](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/guides/large-diagrams.md): Section-by-section strategy for comprehensive technical diagrams
- [Render & Validate](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/guides/render-validate.md): The mandatory render-view-fix loop for polishing diagrams
- [Customization](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/guides/customization.md): How to customize colors and brand styles for your diagrams
- [Color Palette & Brand Style](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/reference/color-palette.md): Single source of truth for all colors and brand-specific styles in Excalidraw diagrams
- [Element Templates](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/reference/element-templates.md): Copy-paste JSON templates for each Excalidraw element type
- [Excalidraw JSON Schema](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/reference/json-schema.md): Complete reference for Excalidraw element types, properties, and structure
- [Render Pipeline](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/reference/render-pipeline.md): How the Python render script converts Excalidraw JSON to PNG using Playwright and headless Chromium
- [Quality Checklist](https://mintlify.wiki/coleam00/excalidraw-diagram-skill/reference/quality-checklist.md): 27-item checklist for validating diagram quality before delivery