Agent skill

Diagram Generator

by luongnv89 in luongnv89/skills

Generate a diagram and route to the right engine — draw.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes).

MITAuto-check passedDevelopment

Install Diagram Generator

skills CLI
$ npx skills add luongnv89/skills --skill diagram-generator -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install luongnv89/skills diagram-generator --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/luongnv89/skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/diagram-generator .claude/skills/diagram-generator && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
diagram-generator
GitHub stars
131
Token cost
~2.2k tokens
SKILL.md length
1,059 words
Files
4 (incl. references)
Skills in repo
35
Repo updated
First seen
Licence
MIT

At a glance

Generate a diagram and route to the right engine — draw.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes).

  • Works in 6 steps: The request asks for Mermaid, a slide… → The request updates an existing file →… → The request names exactly one tool or… → …
  • Tasks that involve Diagrams
  • SKILL.md covers Which engine?, Dependency Preflight (mandatory), Repo Sync Before Edits… and Workflow, plus 4 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Diagram Generator is an agent skill from luongnv89/skills. 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.

Its SKILL.md is about 2.2k tokens, which your agent loads only when the skill is triggered. The skill folder holds 6 other files, including reference files (for example `docs/README.md`, `evals/evals.json` and `references/final-report.md`).

It sits in Development, covering Diagrams. It works with draw.io, Excalidraw and Mermaid. The repository describes itself as: Supercharge your AI agents/bots with reusable skills. The licence is MIT.

When your agent uses it

  • Tasks that involve Diagrams

Example prompts

  • “/diagram-generator”

Requirements

  • Node.js

Workflow steps

6 steps, taken from the first numbered list in SKILL.md.

  1. The request asks for Mermaid, a slide deck, or brand/marketing graphics → do not route. Write
  2. The request updates an existing file → route by its extension: .drawio → drawio-generator,
  3. The request names exactly one tool or editing target ("draw.io", "diagrams.net", "Confluence",
  4. The request names both tools → if it asks for both files, follow Edge Cases → Both formats;
  5. The request asks for a hand-drawn, sketch, whiteboard, or wireframe look → excalidraw-generator.
  6. No format signal → ask one question: "Precise and editable (draw.io) or hand-drawn sketch

What it can do on your machine

Read from SKILL.md and the folder at commit b5ef695. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are bash).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Diagram Generator loads about 2.2k tokens when it runs, and up to ~3.2k if it reads all its reference files. Until then it costs about 67 tokens; SKILL.md has 1,059 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~67
When it runs · the whole SKILL.md, loaded when a task matches
~2.2k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~3.2k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from luongnv89/skills at commit b5ef695, republished under its MIT licence (© luongnv89). 1,059 words, ~2,239 tokens.

Download SKILL.mdSave it as .claude/skills/diagram-generator/SKILL.md (or your agent's skills folder). This skill also uses 3 other files; get the full folder from GitHub.
name
diagram-generator
description
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.
license
MIT
effort
high
dependencies
drawio-generator, excalidraw-generator
metadata.version
1.4.0
metadata.author
Luong NGUYEN <luongnv89@gmail.com>

Diagram Generator

Single entry point for "make me a diagram". This umbrella picks one engine and hands the request to it. Both engines cover the same diagram types (flowchart, architecture, C4, ER, sequence, mind map) through the same four phases (Understand → Propose → Generate → Validate); they differ only in output format and aesthetic. The umbrella writes no file itself. Its body stays short to protect the agent's context window; report templates live in references/.

Which engine?

EngineWhen the user wants...Output
drawio-generatorPrecise, professional diagrams to edit later in draw.io / diagrams.net / Confluence; official C4 styling; swimlanes; multi-pagekebab-case .drawio file (XML)
excalidraw-generatorA hand-drawn, sketchy, whiteboard feel; wireframes; quick collaborative sketcheskebab-case .excalidraw file (JSON)

Apply the routing rules in order and stop at the first rule that matches:

  1. The request asks for Mermaid, a slide deck, or brand/marketing graphics → do not route. Write the out-of-scope Final Report (Mermaid is native Markdown; use a presentation or design tool for the others).
  2. The request updates an existing file → route by its extension: .drawio → drawio-generator, .excalidraw → excalidraw-generator.
  3. The request names exactly one tool or editing target ("draw.io", "diagrams.net", "Confluence", "Excalidraw") → route to that engine, even when the aesthetic words point to the other one.
  4. The request names both tools → if it asks for both files, follow Edge Cases → Both formats; otherwise ask the routing question in rule 6.
  5. The request asks for a hand-drawn, sketch, whiteboard, or wireframe look → excalidraw-generator.
  6. No format signal → ask one question: "Precise and editable (draw.io) or hand-drawn sketch (Excalidraw)?" Wait for the answer. If the user explicitly delegates ("just pick", "choose for me", "use the default"), route architecture, C4, ER, sequence, and swimlane diagrams to drawio-generator, and wireframes, brainstorms, and mind maps to excalidraw-generator. Anything else that is delegated goes to drawio-generator.

Silence is not delegation. Ask content questions (entities, relationships, direction) only inside the engine's Phase 1, never in the umbrella.

Dependency Preflight (mandatory)

This skill invokes the two engines declared in frontmatter dependencies, but each run needs only the one that routing selects. Run this once, after routing and before the engine starts:

bash
if command -v asm >/dev/null && asm deps --help >/dev/null 2>&1; then
  asm deps discover diagram-generator --json || echo "discover failed; acquire still runs" >&2
  echo "dg_mode=lease"
else
  echo "asm deps unavailable: npm install -g agent-skill-manager@latest" >&2
  echo "dg_mode=installed"
fi
printf 'dg_session=%s\n' "diagram-generator-$(date +%s)-$$"   # record it; reuse it verbatim
  1. With dg_mode=lease, run asm deps acquire <engine> --session <dg_session> --json for the routed engine only. Record the returned skillMdPath.
  2. With dg_mode=installed, run test -f "$HOME/.claude/skills/<engine>/SKILL.md" || test -f "$HOME/.agents/skills/<engine>/SKILL.md" and record the path that exists.
  3. If step 1 or 2 fails, print Missing skill: <engine> — install: asm install github:luongnv89/skills:skills/diagram-generator/<engine> -p claude --yes, then stop with the missing-engine Final Report. Never substitute the other engine. Never imitate the engine inline.
  4. Release in finally. If any acquire ran, run asm deps release --session <dg_session> --json once at every terminal outcome, stops included, after the closing Final Report.

Do not acquire the engine that routing did not select.

Repo Sync Before Edits (mandatory)

The umbrella runs no git command and writes no file. The routed engine runs its own Repo Sync Before Edits (scoped to the output file's repository, with its conflict and network-failure rules) before it writes. Do not run a second sync here, and do not skip the engine's sync.

Workflow

  1. Apply the routing rules. If rule 1 matches, write the out-of-scope Final Report and stop.
  2. If rule 4 or 6 asks the routing question, wait for the answer. If the user has not answered after the question was asked twice (Edge Cases), write the unanswered-routing Final Report and stop.
  3. Print one line: Routing to <engine>: <the rule that matched, in the user's words>.
  4. Run the Dependency Preflight.
  5. Read the recorded SKILL.md path and follow that engine's workflow with the user's request unchanged. The engine owns its questions, file naming, Repo Sync, validation, and fix cycles. It also asks for confirmation before it overwrites an existing file; never skip or pre-answer that confirmation.
  6. Relay the engine's Final Report as the run's closing output (Final Report below).
  7. Run the release step of the Dependency Preflight.
Show full SKILL.md (402 more words)Show less

Final Report

Both engines end every run, stops included, with a four-line Final Report (Result: COMPLETE | PARTIAL | BLOCKED, Evidence:, Uncertainty:, Decision:). When an engine ran, its Final Report is this skill's closing output. Relay it verbatim: do not restate it, re-grade it, or change its status. If the release step fails, add one line after the closing report, whichever skill wrote it: Router note: asm deps release failed for session <dg_session>; run asm deps release --session <dg_session> --json.

When the umbrella stops before any engine runs (out of scope, unanswered routing question, missing engine), it writes its own four-line report with status BLOCKED. Templates and fill rules: references/final-report.md. Expected output when the routed engine is missing:

text
Result: BLOCKED. No diagram written: drawio-generator is not installed.
Evidence: Routed to drawio-generator (rule 3, "in draw.io"). Preflight dg_mode=lease; asm deps acquire drawio-generator failed.
Uncertainty: No engine ran, so no file was generated or validated.
Decision: Install drawio-generator with the printed command, then re-run. Excalidraw output is available only if you ask for it.

Example

text
Input:   "Draw a sketchy onboarding wireframe for mobile."
Route:   Routing to excalidraw-generator: rule 5, "sketchy wireframe".
Closing: excalidraw-generator's Final Report, relayed unchanged, e.g.
         Result: COMPLETE. Wrote mobile-onboarding-wireframe.excalidraw (...)

Acceptance Criteria

Verify these for every run:

  • Routing follows the first matching rule. Exactly one engine runs, unless the user asked for both files.
  • The routed engine matches the requested tool, existing file extension, or aesthetic, and the Routing to line names the matching rule.
  • The preflight acquires or checks only the routed engine. A missing engine stops the run with no file written and no substitution.
  • When an engine ran, the closing output is that engine's Final Report, unchanged.
  • When the umbrella stopped, its report opens with Result: BLOCKED and has Evidence:, Uncertainty: and Decision: lines.
  • The closing report passes the four reader checks in references/final-report.md (result findable, facts and assumptions separated, claims traceable, next decision clear). Without a human reviewer's answer, human understanding is unconfirmed.

Edge Cases

  • Both formats — run the engine the user named first, or drawio-generator when no order was given. After its Final Report, run the other engine on the same content without asking again, because the user already asked for both: acquire it under the same dg_session. If the first engine ended BLOCKED, ask before running the second. Relay each engine's Final Report in turn.
  • Unanswered routing question — ask it once more. Silence or a timeout is not delegation. If the user still does not answer, write the unanswered-routing Final Report.
  • Routed engine unavailable — the preflight stops the run. Name the other engine as an option the user may request explicitly, and never switch to it on your own.
  • Request for an image file (PNG, SVG) — say that both engines write an editable file that its editor can export to PNG or SVG. If the user accepts that, continue with the routing rules. Otherwise write the out-of-scope Final Report.

© luongnv89, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 3 other files (references) in skills/diagram-generator of luongnv89/skills.

  • SKILL.md
  • docs/README.md
  • evals/evals.json
  • references/final-report.md

Open the folder on GitHubat commit b5ef695

Compare with similar skills

Diagram Generator next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Diagram Generator compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Diagram Generator this skillluongnv89/skills131—~2.2kAutomated safety check: PassMIT
Diagram Designcathrynlavery/diagram-design48k1 repos~7.6kAutomated safety check: PassMIT
System Design Artifact IntakeHoangNguyen0403/agent-skills-standard572—~1.3kAutomated safety check: PassMIT
Draw.io Diagram StudioAgents365-ai/drawio-skill10k—~2.4kAutomated safety check: NotesMIT
Excalidraw Skillyctimlin/mcp_excalidraw2.5k—~4.6kAutomated safety check: PassMIT
Drawio Skillyuanchen-home/cumcm-step-review319—~11kAutomated safety check: PassMIT

Similar skills

  • Diagram Design

    cathrynlavery/diagram-design

    Creates branded diagrams, from architecture, flowchart and sequence to charts and maps, as self-contained HTML with inline SVG, with import from draw.io, Mermaid and Excalidraw.

    48k GitHub starsUsed in 1 repo~7.6k tokens
    DevelopmentAuto-check passed
  • System Design Artifact Intake

    HoangNguyen0403/agent-skills-standard

    Ingest a provided design artifact - screenshot, drawio, Mermaid, PlantUML, Excalidraw, slides, PDF, or IaC - into a reviewable fact sheet.

    572 GitHub stars~1.3k tokensUpdated yesterday
    DevelopmentAuto-check passed
  • Draw.io Diagram Studio

    Agents365-ai/drawio-skill

    Creates and edits editable draw.io diagrams from descriptions, code, infrastructure files, SQL and API schemas, with sync, review, test and export tools.

    10k GitHub stars~2.4k tokensUpdated 8 days ago
    DevelopmentAuto-check: notes
  • Excalidraw Skill

    yctimlin/mcp_excalidraw

    Excalidraw canvas toolkit for creating, editing, and refining diagrams on a live canvas.

    2.5k GitHub stars~4.6k tokensUpdated yesterday
    DevelopmentAuto-check passed
  • Drawio Skill

    yuanchen-home/cumcm-step-review

    A skill your agent uses when the user requests diagrams, flowcharts, architecture diagrams, ER diagrams, UML / sequence / class diagrams, SysML / MBSE diagrams (block definition, internal block…

    319 GitHub stars~11k tokensUpdated 1 mo ago
    DevelopmentAuto-check passed
  • Drawio

    bahayonghang/drawio-skills

    Create, edit, replicate, import, and export draw.io diagrams with an offline YAML-first workflow: architecture, network topologies, flowcharts, UML/ER, org charts, Mermaid/CSV conversion, existing…

    287 GitHub stars~4.1k tokensUpdated 1 mo ago
    DevelopmentAuto-check: notes

More from luongnv89/skills

All 35 skills in this repo
  • Dont Make Me Think

    luongnv89/skills

    Review UI usability using Steve Krug's principles and produce a scannable report.

    131 GitHub stars~2.5k tokensUpdated yesterday
    Auto-check passed
  • Herdr Agent

    luongnv89/skills

    Manage AI agent fleets in Herdr: tile root + sub-agents in one tab, start/prompt/wait/read/monitor via the herdr agent CLI, steer any pane; help lists every operation.

    131 GitHub stars~4.8k tokensUpdated yesterday
    Auto-check passed
  • Ollama Optimizer

    luongnv89/skills

    Optimize Ollama configuration for the current machine's hardware.

    131 GitHub stars~4.1k tokensUpdated yesterday
    Auto-check: notes
  • Security Setup

    luongnv89/skills

    Install local-first security hardening: pre-commit secret detection, offline dependency scans, static analysis, reports, and gated free CI.

    131 GitHub stars~4.5k tokensUpdated yesterday
    Auto-check passed
  • SEO AI Optimizer

    luongnv89/skills

    Audit and optimize websites for technical SEO, content SEO, and AI bot accessibility.

    131 GitHub stars~2.7k tokensUpdated yesterday
    Auto-check passed
  • Tasks Generator

    luongnv89/skills

    Generate sprint-based development tasks from a PRD. An agent skill from luongnv89/skills.

    131 GitHub stars~3.8k tokensUpdated yesterday
    Auto-check passed

Questions about Diagram Generator

What does Diagram Generator do?

Generate a diagram and route to the right engine — draw.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes). Diagram Generator is an agent skill from luongnv89/skills.io XML (precise, editable, C4, swimlanes) or Excalidraw JSON (hand-drawn, sketch, wireframes).

When should I use Diagram Generator?

Diagram Generator fits situations like: tasks that involve Diagrams.

How do I install Diagram Generator in Claude Code?

Run `npx skills add luongnv89/skills --skill diagram-generator -a claude-code`. Or copy the skill folder (skills/diagram-generator in luongnv89/skills) into .claude/skills/diagram-generator in your project. Claude Code loads it when a task matches its description.

How do I install Diagram Generator in Codex?

Run `npx skills add luongnv89/skills --skill diagram-generator -a codex`. Or copy the skill folder (skills/diagram-generator in luongnv89/skills) into .agents/skills/diagram-generator in your project. Codex loads it when a task matches its description.

Can I use Diagram Generator in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add luongnv89/skills --skill diagram-generator -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/diagram-generator, .gemini/skills/diagram-generator, .github/skills/diagram-generator and .opencode/skills/diagram-generator in your project.

What does Diagram Generator need to run?

SKILL.md names no scripts, command-line tools or credentials: Diagram Generator is instructions for the agent only. Our summary lists: Node.js.

Does Diagram Generator access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Diagram Generator safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Diagram Generator use?

Diagram Generator is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Diagram Generator use?

About 2.2k tokens (SKILL.md is roughly 9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 965 tokens, read only when the agent opens those files.

What are the alternatives to Diagram Generator?

Skills that share tags, products or a category with Diagram Generator: Diagram Design (cathrynlavery/diagram-design, 48k stars), System Design Artifact Intake (HoangNguyen0403/agent-skills-standard, 572 stars), Draw.io Diagram Studio (Agents365-ai/drawio-skill, 10k stars) and Excalidraw Skill (yctimlin/mcp_excalidraw, 2.5k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Diagram Generator?

luongnv89 (a GitHub user) maintains it in luongnv89/skills, which has 131 GitHub stars. The repository holds 35 skills in this directory. The repository was last updated on October 9, 2026.

Source: luongnv89/skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.