skills.rest
msasikumar
msasikumarCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

excalidraw-skill

Create and manipulate Excalidraw diagrams via MCP or REST API.

1|Updated Mar 14, 2026
Search Tags:#collaboration#mermaid#excalidraw#diagramming#ai art#vector graphics
One-click install
npx skills add https://github.com/msasikumar/home-excalidraw --skill excalidraw-skill-msasikumar
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: excalidraw-skill
Source: https://github.com/msasikumar/home-excalidraw/tree/main/skills/excalidraw-skill
Command: npx skills add https://github.com/msasikumar/home-excalidraw --skill excalidraw-skill-msasikumar

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill enables AI agents to programmatically create, edit, and refine Excalidraw diagrams on a live canvas, bridging the gap between conceptual ideas and visual representations.

Core Features & Use Cases

  • Live Canvas Control: Draw, modify, and manage diagram elements in real-time.
  • Iterative Refinement: Use visual feedback (screenshots) and scene descriptions for AI-driven adjustments.
  • Format Conversion: Convert Mermaid diagrams to Excalidraw and export to various formats (PNG, SVG, .excalidraw).
  • Use Case: An AI agent can take a textual description of a system architecture and generate a detailed, interactive Excalidraw diagram, allowing for immediate visual inspection and further AI-driven modifications.

Quick Start

Use the excalidraw-skill to draw a rectangle with the text "Hello World" at coordinates x=100, y=100.

Frequently Asked Questions about excalidraw-skill

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

FAQPage Schema
How do I use AI to automatically generate Excalidraw diagrams on a live canvas?▼

To generate Excalidraw diagrams with AI, the Skill provides programmatic control over a live canvas, allowing agents to create and manipulate elements via CRUD operations through an accessible MCP or REST API server.

Can I convert Mermaid syntax into Excalidraw vector graphics?▼

Yes, you can convert Mermaid syntax into Excalidraw vector graphics. The Skill supports format conversion, translating Mermaid diagrams into editable Excalidraw elements for further visual refinement and export.

What is the best way to refine AI-generated diagrams using visual feedback?▼

The best way to refine AI-generated diagrams is through iterative visual feedback. The Skill captures screenshots and scene descriptions, allowing AI agents to make layout adjustments and element-level modifications based on the visual output.

Do I need a running Excalidraw canvas server to use this diagramming Skill?▼

Yes, you need a running Excalidraw canvas server. The Skill requires an active server accessible via MCP or REST API to programmatically execute element-level operations and real-time layout adjustments.

How do I export Excalidraw diagrams to SVG or PNG formats programmatically?▼

You can export Excalidraw diagrams programmatically by utilizing the Skill's format conversion capabilities. After creating or refining elements on the live canvas, the Skill supports exporting the final output to PNG, SVG, or native .excalidraw formats.

Are there limitations when using AI agents for diagram layout adjustments in Excalidraw?▼

Limitations include the dependency on a continuously running Excalidraw canvas server and the AI's ability to interpret visual feedback. Complex iterative refinement requires accurate scene descriptions for successful element-level manipulation.

Related Skills

Explore More Design & Creative Skills→
cloudbackenddevcloudbackenddev
1

excalidraw-skill

Create and manipulate diagram elements on a live Excalidraw canvas via MCP.

Community
Advanced
y0nchay0ncha
1

excalidraw-diagrams

Generate editable Excalidraw diagram files with programmatic layout and styling.

Community
Intermediate
sadie100sadie100

diagram

Convert Mermaid diagrams into editable .excalidraw files.

Community
Intermediate
mahmoud20138mahmoud20138
10

programmatic-drawing

Generate visual art, diagrams, charts, and drawings using SVG, HTML Canvas, p5.js, Three.js, Mermaid, and D3.js.

Community
Advanced