skills.rest
thomast1906
thomast1906COMMUNITY
Explore all skills by this author →
Website𝕏@tamstar1234GitHub

excalidraw-mcp-diagramming

Create and edit collaborative diagrams on Excalidraw canvases with layout templates.

193|55|Updated Feb 18, 2026
Search Tags:#workflow#collaboration#system design#excalidraw#diagramming#visualization
One-click install
npx skills add https://github.com/thomast1906/github-copilot-agent-skills --skill excalidraw-mcp-diagramming
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: excalidraw-mcp-diagramming
Source: https://github.com/thomast1906/github-copilot-agent-skills/tree/main/.github/skills/excalidraw-mcp-diagramming
Command: npx skills add https://github.com/thomast1906/github-copilot-agent-skills --skill excalidraw-mcp-diagramming

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill enables users to generate and edit diagrams on a shared Excalidraw canvas, facilitating real-time visual collaboration and system design.

Core Features & Use Cases

  • Live Diagram Creation: Draw and update system architectures, workflows, or mind maps directly on an Excalidraw shared workspace.
  • Multiple Diagram Types: Supports diagrams such as layered architectures, data flows, sequence diagrams, and hierarchies with precise coordinate templates.
  • Use Case: For example, a user can quickly visualize a multi-tier web architecture with zones and annotated arrows, then export the result as PNG or shareable URL.

Quick Start

Create a new UML sequence diagram showing a user login flow with labeled actors and message arrows.

Frequently Asked Questions about excalidraw-mcp-diagramming

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

FAQPage Schema
How do I create a system architecture diagram on an Excalidraw canvas?▼

To create an Excalidraw diagram, you use provided commands for shape creation and coordinate templates to draw layered architectures, data flows, or sequence diagrams directly onto a shared workspace.

Can I export a workflow diagram from Excalidraw as a PNG?▼

Yes, you can export workflow diagrams from the Excalidraw canvas. The Skill implements screenshot retrieval commands that allow you to export your visual system designs as PNG images or shareable URLs.

What is the best way to visualize a multi-tier web architecture with zones?▼

The best way to visualize a multi-tier web architecture is using the Skill's precise coordinate templates to draw zones and annotated arrows, ensuring clear visual presentation and easy iteration.

Does this support drawing UML sequence diagrams for user login flows?▼

Yes, it supports drawing UML sequence diagrams. You can visualize user login flows by using the layout patterns to map labeled actors and message arrows on the live canvas.

How do I update an existing process visualization on a shared Excalidraw workspace?▼

You can update an existing process visualization by using the shape update commands. This allows you to iterate on your system design directly on the live Excalidraw canvas in real-time.

Related Skills

Explore More Software Engineering Skills→
ARAVINDAN20ARAVINDAN20
4

excalidraw-skill

Control Excalidraw diagrams on a live canvas via MCP and REST APIs.

Community
Advanced
jg-chalk-iojg-chalk-io

moai-mermaid-diagram-expert

Render Mermaid diagrams into SVG and PNG images via CLI.

Community
Advanced
tianxiao1430-jpgtianxiao1430-jpg
17

vision-expert

Convert UI screenshots into production-ready code using zai-vision tools.

Community
Advanced
auxi-wardrobeauxi-wardrobe
1

excalidraw

Generate Excalidraw diagrams from codebases and JSON files.

Official
Advanced