Diagram Generator logo

Diagram Generator

Community
luongnv89
diagram-generator

Generate a diagram and route to the right engine — draw.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes). One entry for flowcharts, architecture, ER, sequence, mind maps. Don't use for Mermaid or slides.

Overview

Publisherluongnv89
Repositoryskills
Skill namediagram-generator
Stars
124
Forks
18
Bundled files
16
LicenseMIT
Links
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • 16 bundled files

    Scripts, templates, and references the model can read while it works. Files are read-only and never executed.

  • Open source

    Published by luongnv89 on GitHub. Read the source before you install it.

Installation

Install the Diagram Generator AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/luongnv89/skills.git /tmp/skills
mkdir -p .claude/skills
cp -r /tmp/skills/skills/diagram-generator .claude/skills/diagram-generator
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Diagram Generator in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Diagram Generator on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Diagram Generator is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

Diagram Generator

Single entry point for "make me a diagram". This umbrella picks the right engine and hands off to it — both produce the same diagram taxonomy (flowchart, architecture, C4, ER, sequence, mind map) through the same four phases (Understand → Propose → Generate → Validate); they differ only in output format and aesthetic.

Which engine?

PickWhen the user wants...OutputNested skill
draw.ioPrecise, professional diagrams to edit later in draw.io / diagrams.net / Confluence; official C4 styling; swimlanes; multi-page.drawio XMLdrawio-generator
ExcalidrawA hand-drawn, sketchy, whiteboard feel; wireframes; quick collaborative sketches.excalidraw JSONexcalidraw-generator

Routing rules:

  • The user names a format or tool ("draw.io", "diagrams.net", "Excalidraw", "whiteboard sketch") → use that engine.
  • The user names an editing target ("I'll tweak it in draw.io", "import to Confluence") → draw.io.
  • The user wants a hand-drawn / sketch / wireframe look → Excalidraw.
  • No format signal → ask one question: "Precise and editable (draw.io) or hand-drawn sketch (Excalidraw)?" Keep routing blocked until the user answers. Only after explicit delegation such as "just pick", "choose for me", or "use the default", choose draw.io for architecture/C4/technical diagrams and Excalidraw for wireframes/brainstorms.
  • The user asks for Mermaid, a slide deck, or brand/marketing graphics → out of scope; say so (Mermaid is native markdown; use a presentation or design tool for the others).

How to use

Once the engine is chosen, invoke the nested skill by name — the runtime resolves names regardless of filesystem path:

  • /drawio-generator — generate draw.io XML
  • /excalidraw-generator — generate Excalidraw JSON

Each engine owns its full workflow, references/, agents/, and validation checks. This umbrella stays short to protect the agent's context budget; it only routes.

Prerequisites

  1. Confirm at least one nested engine is installed and callable.
  2. Require enough diagram content to identify nodes, relationships, and intended audience; ask for missing essentials before routing.
  3. Check whether the requested output path already exists. Let the selected engine run its own confirmation, backup, dry-run, error, and rollback safeguards before any overwrite.

If the user explicitly requested a format, tool, editing target, or aesthetic and its engine is unavailable, stop and explain which nested skill must be installed; provide the matching command (asm install github:luongnv89/skills:skills/diagram-generator/drawio-generator or asm install github:luongnv89/skills:skills/diagram-generator/excalidraw-generator) and ask the user to install it or explicitly change the requested output. Do not substitute the other engine. If no format or aesthetic was explicit, an available engine may be offered as a fallback only after explaining the output difference and receiving user approval. If neither engine is available, fail with an installation error and name both required skills. Never invent XML or JSON under the wrong engine as a fallback.

Example

text
Input: "Draw a sketchy onboarding wireframe for mobile."
Route: excalidraw-generator
Expected output: one validated .excalidraw JSON artifact

Acceptance Criteria

Verify every routed run:

  • Exactly one engine is selected unless the user explicitly requests both formats.
  • The selected engine matches the requested format, editing target, or aesthetic.
  • The nested workflow reaches its Validate phase and produces its expected output artifact.
  • The artifact passes the engine's structural checks; validation errors are reported, not hidden.
  • Existing files are not overwritten without the selected engine's required confirmation or backup.

Step Completion Reports

After routing, emit:

text
◆ Route Diagram
  Engine available:    √ pass
  Route justified:     √ pass
  Output validated:    √ pass
  Result:              PASS | FAIL | PARTIAL

Use × fail — reason when a check fails. Report PASS only after the nested engine's acceptance criteria and expected result are verified.

Edge Cases

  • User explicitly wants both formats — generate with one engine first, then offer to regenerate the same diagram in the other.
  • Ambiguous, no answer to the routing question — keep routing blocked and ask the question again; silence or timeout is not approval to choose an engine. Apply the routing heuristics only when the user explicitly delegates the choice (for example, "just pick", "choose for me", or "use the default").
  • Explicitly requested engine is unavailable — do not fall back. Report the unavailable nested skill, provide its installation guidance, and ask the user to install it or explicitly approve a different format/aesthetic.
  • No explicit format and the selected engine is unavailable — offer the installed engine as an alternative, explain its format/aesthetic, and route only after explicit user approval.

Bundled files

The model reads these on demand while the skill is loaded. They are exposed as readable files and are never executed.

Frequently asked questions

What does the Diagram Generator AI skill do?

Generate a diagram and route to the right engine — draw.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes). One entry for flowcharts, architecture, ER, sequence, mind maps. Don't use for Mermaid or slides.

Why use Diagram Generator on TypingMind?

Because you install it once and use it with any model. Diagram Generator is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Diagram Generator in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/luongnv89/skills/tree/main/skills/diagram-generator. TypingMind reads its SKILL.md and bundles its files and installs it as a skill you can enable per chat.

Which AI models can use Diagram Generator?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Diagram Generator?

As many as you like. As long as a model supports skills, you can use Diagram Generator with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Diagram Generator AI skill free?

Yes. It is published on GitHub by luongnv89 under the MIT license. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

View all

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇