skillfed

excalidraw-ai

excalidraw-ai lets you build Excalidraw diagrams by writing JSON directly, with complete control over shapes, text, arrows, and styling. It includes the full Excalidraw schema, component-based color palettes for architecture diagrams, and access to 305+ professional icons across five libraries for system design, AWS services, and more.

excalidraw-ai generates professional diagrams programmatically using JSON with full schema control and 305+ icon libraries.

AI-generated summary based on this skill's SKILL.md

7 1 MIT updated by jiatastic

Install

jiatastic/open-python-skills/excalidraw-ai · repository language: Python

CLI (skillfed)coming soon
git clone https://github.com/jiatastic/open-python-skills
cp -r open-python-skills/skills/excalidraw-ai ~/.claude/skills/excalidraw-ai

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I create excalidraw diagrams with JSON?

excalidraw-ai lets you build Excalidraw diagrams by writing JSON directly, giving you complete control over shapes, text, arrows, and styling. You define each element—rectangles, circles, lines, and text—as JSON objects with properties like position, size, color, and stroke. The skill includes the full Excalidraw schema so you can programmatically construct any diagram without using the GUI.

Can excalidraw-ai generate architecture diagrams programmatically?

Yes. excalidraw-ai is built for architecture and system design visualization. It provides component-based color palettes tailored for architecture diagrams and access to 305+ professional icons across five libraries, including AWS services and system design symbols. You can automate diagram creation from code analysis or define complex architectures as JSON structures.

What icon libraries and resources does excalidraw-ai include?

excalidraw-ai includes access to 305+ professional icons spanning five libraries for system design, AWS services, and more. Beyond icons, the skill provides the complete Excalidraw schema reference, component-based color palettes for consistent styling, and element type documentation so you have all resources needed for professional diagram generation.

Can I build flowcharts and mind maps with full element control?

Yes. excalidraw-ai lets you build flowcharts and mind maps by writing JSON, giving you full control over every element—shapes, connectors, text, colors, and positioning. You define each component directly without relying on templates, enabling custom layouts and automated generation from your own data structures or code analysis.

What is the excalidraw-ai JSON schema reference?

excalidraw-ai includes the full Excalidraw schema documentation covering all element types and their properties. This reference documents how to define shapes, arrows, text, containers, and styling attributes in JSON format, enabling you to programmatically construct diagrams with precise control over every visual aspect.

How does excalidraw-ai support diagram as code workflows?

excalidraw-ai enables diagram-as-code by letting you define complete visualizations as JSON. You can version-control diagrams, automate generation from code analysis, integrate diagram creation into CI/CD pipelines, and maintain diagrams alongside your codebase. The MIT license supports both open-source and commercial use.

SKILL.md

rendered from the published skill — quoted content, verbatim

excalidraw-ai

Generate Excalidraw diagrams by writing JSON directly. No templates needed - you have full control over every element.

When to Use This Skill

Use this skill when you need to: - Create architecture diagrams, flowcharts, or mind maps - Visualize system designs, data flows, or processes - Generate diagrams from code analysis or documentation - Create custom diagrams with precise control over layout and styling

Excalidraw JSON Schema

An Excalidraw file is a JSON object with this structure:

{
  "type": "excalidraw",
  "version": 2,
  "source": "https://excalidraw.com",
  "elements": [ /* array of element objects */ ],
  "appState": {
    "viewBackgroundColor": "#ffffff",
    "gridSize": null
  },
  "files": {}
}
Element Types
Rectangle

```json { "id": "unique-id-1", "type": "rectangle", "x": 100, "y": 100, "width": 200, "height": 100, "strokeColor":

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 6 files
skills/excalidraw-ai/SKILL.md
skills/excalidraw-ai/assets/aws-architecture-icons.excalidrawlib
skills/excalidraw-ai/assets/drwnio.excalidrawlib
skills/excalidraw-ai/assets/software-architecture.excalidrawlib
skills/excalidraw-ai/assets/system-design-template.excalidrawlib
skills/excalidraw-ai/assets/system-design.excalidrawlib

Related skills

Tags

diagram-as-code json-based-graphics architecture-visualization ai-native-drawing schema-driven-design programmatic-diagramming system-architecture-tool template-free-creation