diagram

Convert textual descriptions into interactive diagrams with editable Excalidraw files.

Updated Jun 19, 2026
One-click install
npx skills add https://github.com/moogieon/kadera --skill diagram-moogieon
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: diagram
Source: https://github.com/moogieon/kadera/tree/main/.claude/skills/gstack/diagram
Command: npx skills add https://github.com/moogieon/kadera --skill diagram-moogieon

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires excalidraw, mermaid, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill solves the challenge of visualizing complex ideas by converting textual descriptions into interactive diagrams. It's ideal for collaboration, architecture design, and flowchart creation.

Core Features & Use Cases

  • Interactive Diagrams: Converts English descriptions into diagram triplets (source, editable .excalidraw file, rendered image).
  • Diagram Creation: Supports a wide range of diagram types including flowcharts, architecture diagrams, and more.
  • Use Case: Easily communicate architecture designs, system flows, or process sequences through intuitive diagrams.

Quick Start

Invoke the diagram skill by saying "make a diagram" or "draw a flowchart" and provide the description you want to visualize.

Frequently Asked Questions about diagram

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

FAQPage Schema
How do I create an architecture diagram from a text description?

Creating an architecture diagram from text involves converting English descriptions into interactive diagram triplets. You provide the textual input, and the skill outputs a source file, an editable .excalidraw file, and a rendered image for collaboration.

Can I use Excalidraw and Mermaid to visualize system flows?

Yes, the skill uses Excalidraw and Mermaid to visualize system flows. It transforms English descriptions into interactive diagrams and rendered images, facilitating the communication of design and architectural concepts.

What is the best way to generate a flowchart for collaborative design?

The best way to generate a flowchart for collaborative design is by converting English descriptions into interactive diagrams. This method outputs an editable .excalidraw file and a rendered image, enabling teams to easily communicate and modify process sequences.

Does the diagram skill support exporting to SVG or PNG formats?

Yes, the diagram skill supports SVG and PNG rendering. It converts textual descriptions into interactive diagrams, outputting a source file, an editable .excalidraw file, and a rendered image in either SVG or PNG format.

When should I use a text-to-diagram tool instead of manually drawing?

You should use a text-to-diagram tool instead of manually drawing when visualizing complex ideas for collaboration. It converts English descriptions into interactive diagrams, editable .excalidraw files, and rendered images, ideal for communicating architecture designs.