Home / Resources / Agent Skills
Open source · MIT · zero deps · v1.0

Say one sentence to your AI assistant —
it draws an editable mind map

draw-diagrams is MemoBrain's agent skill: one command installs it into your AI coding assistant (Claude Code, Codex, Cursor, DeepSeek Harness…). From then on, just type a prompt like "turn this into a mind map" and get a real diagram — not a screenshot, but a live map where every node is editable, layouts switchable, and exports ready.

What it looks like

On the left, what you say. On the right, what it generates — the same outline in two themes. Frames scroll for the full map.

$ npx skills add memobrain/draw-diagrams
$ Done. Now give your AI assistant a prompt:
 
You: Make a mind map of our product launch
    plan, 4 levels deep, minimal theme
 
AI: Generated "Product Launch Plan" — 61 nodes:
· product-launch.svg —— preview image
· product-launch.xdt —— editable source
· open online —— laid out & editable
minimal blackboard name a theme in your prompt — here is one of each ↓
Generated mind map in the minimal theme: product launch plan, 61 nodes, 4 levels
minimal theme · generated output
The same outline rendered in the blackboard theme
blackboard themesame outline, one-sentence switch
app.memobrain.net — laid out, ready to edit
The map opened in the web editor
Click the "open online" link — edit text, add branches, switch layouts, export — right in the browser

Install — pick your path

A skill is just a small folder with an instruction file. Drop it where your assistant looks for skills. All three paths do the same thing.

①

One command (recommended)

For machines with Node.js. The CLI auto-detects your installed assistants (Claude Code / Codex / Cursor…) and installs into them:

npx skills add memobrain/draw-diagrams

No Node.js? Path ② or ③ needs nothing.

②

DeepSeek Harness: zero config

DeepSeek Harness auto-discovers skills in ~/.agents/skills/. Drop the folder there (Windows: C:\Users\you\.agents\skills\):

git clone https://github.com/memobrain/draw-diagrams %USERPROFILE%\.agents\skills\draw-diagrams

Prefer no git? Download the zip, extract into the same folder, name it draw-diagrams.

③

Manual drop-in

Assistants look in slightly different places; the common ones:

~/.claude/skills/draw-diagrams/
~/.agents/skills/draw-diagrams/

Rule of thumb: clone or unzip so that SKILL.md sits directly inside the skill folder.

✓

How to use it

Open your assistant and type a prompt:

"Use draw-diagrams to turn these meeting notes into a mind map." "Redo it as a fishbone." "Same map, blackboard theme."

Only requirement: Python 3.8+ on the machine (the bundled script has zero dependencies).

Every run produces three things

The skill outputs live diagrams — structure lives in the file, looks are handled by MemoBrain's layout engine.

Preview (SVG)

A clean static image for docs, chats and slides. Pick from 9 themes at generation time.

Source file (.xdt)

MemoBrain's editable format — double-click or drag it in. Desktop data stays on your machine.

One-click web editing link

Opens the diagram in your browser, already laid out — edit text, add branches, switch between 25 layouts, export. Nothing to install. Editing is free; saving needs a free account; watermark-free export and AI features come with membership.

Structure-faithful

The skill turns your outline into a tree; placement is done by the layout engine. CJK text is measured by real glyph width — no overflow, no overlap, auto re-layout on edits.

9 themes · 25 layouts · CJK-native

Name one in your sentence, or let the AI pick by content.

Themes

default classic forest sunset lavender minimal morandi journal blackboard

Layouts (switchable anytime inside MemoBrain)

RightLeftBoth sidesFour sides FishboneH timelineV timelineS timeline Tree tableTree table VTree sideTree side up MatrixMatrix VMatrix 2 Brace mapCycle mapBubble mapFan map Dual flowQuad mapOrg chart

FAQ

New to agent skills? Start here.

What exactly is an "agent skill"?
A small folder with an instruction file. Your AI assistant reads the SKILL.md inside and gains a new ability — drawing diagrams. Once installed you never mention the word "skill" again; just type a prompt like "turn this into a mind map."
Which assistants does it work with?
Anything compatible with the open SKILL.md convention: Claude Code, Codex, Gemini CLI, Cursor, and DeepSeek Harness (auto-discovered out of the box). Assistant not on the list? Try dropping the folder into its skills directory, or use the built-in AI in the MemoBrain web app.
Is my content uploaded anywhere?
The skill runs locally: a single zero-dependency Python script, no network, no upload. The "open online" link in the output opens the diagram in the browser editor; if you skip it, the SVG and .xdt files work fully offline.
What does it cost?
The skill is MIT open source and free. Editing generated maps in the browser is free; saving needs a free account; watermark-free export, unlimited files and AI features are membership benefits.
How will I know when the skill updates?
The skill self-checks: at most once a day it compares your installed version with the latest one on GitHub, and when there's an update your AI assistant tells you directly, with the one-line update command (npx skills add memobrain/draw-diagrams; git installs just git pull). You'll hear about it the next time you draw — no manual tracking.
I don't use AI coding tools — can I still play?
Yes. Open app.memobrain.net and use the built-in AI: one sentence generates mind maps, flowcharts and architecture diagrams — same engine, same format as the skill.

Want a map right now, without installing anything?

MemoBrain's web app has built-in AI: one sentence generates mind maps, flowcharts and architecture diagrams — all editable.

Open app.memobrain.net →