skills.rest
AStyer8345
AStyer8345COMMUNITY
Explore all skills by this author →
GitHub

excalidraw

Create and manipulate Excalidraw diagrams programmatically via JSON schema.

Updated Feb 25, 2026
Search Tags:#architecture#json#excalidraw#visualization#diagrams#flowcharts#wireframes
One-click install
npx skills add https://github.com/AStyer8345/adam-styer-skills --skill excalidraw-astyer8345
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: excalidraw
Source: https://github.com/AStyer8345/adam-styer-skills/tree/main/cc-excalidraw-skill
Command: npx skills add https://github.com/AStyer8345/adam-styer-skills --skill excalidraw-astyer8345

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designing and updating diagrams by hand is time-consuming and error-prone. This skill enables you to generate Excalidraw diagrams from structured data or templates, ensuring consistency and rapid iteration.

Core Features & Use Cases

  • Programmatic diagram creation using Excalidraw JSON (types: rectangle, ellipse, diamond, text, arrow, line, freedraw, frame, image).
  • Support for common diagram styles and patterns (flowcharts, architecture diagrams, mind maps) with reusable templates.
  • Use Case: Auto-generate architecture diagrams from a service registry or data model to keep diagrams in sync with your system.

Quick Start

Provide a JSON payload describing a simple diagram (a rectangle with a label) to generate an Excalidraw file.

Frequently Asked Questions about excalidraw

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate Excalidraw diagrams programmatically without manual drawing?▼

You generate Excalidraw diagrams by providing a structured JSON payload defining element types like rectangles, arrows, and text. This programmatically creates Excalidraw files for flowcharts and wireframes without manual drawing.

Can I auto-generate architecture diagrams from JSON data?▼

Yes, you can auto-generate architecture diagrams from a service registry or data model using the Excalidraw JSON schema. This keeps your diagrams synchronized with your system structure without manual updates.

What Excalidraw element types are supported for diagram creation?▼

Supported Excalidraw element types include rectangle, ellipse, diamond, text, arrow, line, freedraw, image, and frame. These elements ensure compatibility when generating flowcharts, mind maps, or wireframes with best-practice styling.

What is the best way to keep wireframes and flowcharts consistent with a data model?▼

The best way to keep wireframes and flowcharts consistent is to generate them programmatically from structured data or templates using the Excalidraw JSON schema. This ensures consistency and rapid iteration without manual updates.

Does this approach support creating mind maps and flowcharts with reusable templates?▼

Yes, programmatic diagram creation supports common styles and patterns like mind maps and flowcharts using reusable templates. You define these structures via the Excalidraw JSON schema to ensure consistent styling.

Related Skills

Explore More Design & Creative Skills→
Devsoul2026Devsoul2026
150

excalidraw

Convert Excalidraw element JSON into ready-to-use .excalidraw diagrams.

Community
Intermediate
jordanhubbardjordanhubbard
9

excalidraw

Generate Excalidraw JSON diagrams from element definitions.

Community
Intermediate
GS1NedGS1Ned

diagram-generator

Generate architecture, database, component, and sequence diagrams using Mermaid syntax.

Community
Intermediate
claude-office-skillsclaude-office-skills
368

diagram-creator

Generate flowcharts, sequence diagrams, and architecture diagrams from Mermaid and PlantUML text.

Official
Intermediate