diagram

Convert English descriptions or mermaid syntax into editable Excalidraw diagrams with SVG and PNG outputs.

127k|19.1k|Updated Mar 11, 2026
One-click install
npx skills add https://github.com/garrytan/gstack --skill diagram-garrytan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: diagram
Source: https://github.com/garrytan/gstack/tree/main/diagram
Command: npx skills add https://github.com/garrytan/gstack --skill diagram-garrytan

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Bash, Read, Write, AskUserQuestion, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill solves the problem of converting English descriptions into editable diagrams, enabling users to visualize complex ideas without manual drawing.

Core Features & Use Cases

  • Convert English to Diagrams: Translate plain text or mermaid syntax into diagram triplets.
  • Editable .excalidraw Files: Generate diagrams that can be opened and edited in Excalidraw.
  • Offline Operation: Use when creating diagrams that need to be rendered SVG + PNG (clean mermaid style; the .excalidraw carries the hand-drawn aesthetic) without internet access.

Quick Start

Create a diagram using the 'diagram' skill with an English description of your desired flowchart.

Frequently Asked Questions about diagram

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

FAQPage Schema
How do I turn English descriptions into editable flowcharts without manual drawing?

You can turn English descriptions into editable flowcharts by converting text or mermaid syntax into Excalidraw files. This generates SVG and PNG outputs, visualizing product architecture and workflows without requiring manual diagram creation.

Can I generate architecture visualization files offline using Excalidraw?

Yes, you can generate architecture visualization files offline. The process creates editable Excalidraw files and renders SVG plus PNG outputs locally, requiring the Excalidraw application and Bash execution capabilities without needing internet access.

Does the diagram generation process support converting mermaid syntax to SVG?

Diagram generation supports converting mermaid syntax to SVG. It translates mermaid syntax or plain text into diagram triplets, outputting clean SVG files alongside PNG formats and editable Excalidraw files.

What is the best way to map process workflows from text for technical and non-technical environments?

The best way to map process workflows from text is converting English descriptions into diagram triplets. This approach generates editable Excalidraw files, suitable for process mapping across both technical and non-technical environments.

Do I need Bash execution capabilities to create editable diagrams from text?

Yes, you need Bash execution capabilities to create editable diagrams from text. Converting English descriptions into Excalidraw files and generating SVG plus PNG outputs requires executing Bash commands within your environment.

What are the limitations of using Excalidraw for architecture visualization compared to clean mermaid style?

A limitation of using Excalidraw for architecture visualization is that the Excalidraw files carry a hand-drawn aesthetic. Clean mermaid style rendering is only applied to the generated SVG and PNG outputs, not the editable source file.