Mermaid Chart agent skills for Claude Code, Cursor and RevampKey

3 ready-made playbooks that teach an AI agent how to do real Mermaid Chart work: which tools to call, what to check first, and when to stop and ask you.

Download RevampKey, free I have it: connect Mermaid Chart

Connect Mermaid Chart once and all 3 skills install themselves and stay up to date. Mac, Windows and Linux.

All 3 Mermaid Chart skills

Each skill is one job. You ask in plain words and the agent loads the skill that matches, then follows its steps.

Start hereAsks before writing7 Mermaid Chart tools

Use Mermaid Chart with AI

Shows Mermaid diagrams in the conversation, and saves, lists or repairs them in your Mermaid.ai account when you sign in. It asks before changing anything in your account.

Use it when

You want a flowchart or sequence diagram rendered without signing in
You want to save a diagram to your Mermaid.ai account
Your diagram has a syntax error and you want it fixed

Tools it uses

display_mermaid
list_personal_diagrams
get_diagram_by_url
save_diagram
update_diagram
repair_diagram
sign_in

Example

Show me a flowchart of the login process, and save it to my account if it looks right.

Here is the login flowchart, rendered in the widget. Before I save it, I need you to sign in to your Mermaid.ai account, and then I'll write the document once you confirm the title.

Use in RevampKeyRead the full skill →

Asks before writing5 Mermaid Chart tools

Draft and publish Mermaid diagrams with AI

Turns a described process, sequence or structure into valid Mermaid code, renders it for review, and saves it to your Mermaid Chart account only after you approve it.

Use it when

You describe a login or checkout process and want a flowchart with failure paths.
You need a sequence diagram of API calls between services for a design review.
You want a state diagram for an order lifecycle, saved to your account once approved.

Tools it uses

display_mermaid
repair_diagram
sign_in
save_diagram
update_diagram

Example

Draw a flowchart of the checkout process including what happens when payment fails.

Here is the checkout flowchart, rendered in the widget, with the card-declined path retrying twice before routing to a cart-saved end state. Two questions for review: should a timeout go to the same end state, and do you want guest checkout shown as a separate branch? I have not saved it yet; tell me when you want it added to your account.

Use in RevampKeyRead the full skill →

Asks before writing5 Mermaid Chart tools

Audit your saved Mermaid diagrams

Reviews your saved Mermaid Chart diagrams for broken syntax, misleading titles and duplicates, then proposes a cleanup plan. It changes nothing until you approve each action.

Use it when

You have accumulated many diagrams and want to know which are broken or duplicated
You want consistent titles across a team's documentation diagrams
You need a cleanup list before a documentation review

Tools it uses

list_personal_diagrams
sign_in
get_diagram_by_url
repair_diagram
update_diagram

Example

Audit my saved diagrams and tell me which ones are broken or duplicates.

I checked 24 of your 30 saved diagrams. Three won't render: two have unbalanced brackets and one uses a reserved word as a node id. Four titles are near-duplicates of others. I haven't changed anything. Reply with the numbers you want me to repair or rename.

Use in RevampKeyRead the full skill →

Get all 3 without copying a file

RevampKey adds the skills when you connect Mermaid Chart, updates them for you and removes them when you disconnect.

Download RevampKey

How Mermaid Chart skills work

Connect Mermaid Chart
The Mermaid Chart MCP server gives the agent its tools.
Ask in plain words
“Draw a flowchart of the checkout process including what happens when payment fails.” Each SKILL.md says when it applies, so only the one that fits is loaded.
Approve any change
The agent calls the tools in order, checks its work, and shows you any change before it makes it.

How to install Mermaid Chart skills

In RevampKey the skills install themselves when you connect Mermaid Chart. In other tools each skill is one folder with a SKILL.md file, and you also need the Mermaid Chart MCP server connected there.

About 1 minute · nothing to copy

Download RevampKey for Mac, Windows or Linux and sign in.
Open Connectors and connect Mermaid Chart. All 3 skills come with it and stay up to date; they go away when you remove the connector.
Ask in plain language, for example “Draw a flowchart of the checkout process including what happens when payment fails.”
Download RevampKeyConnect Mermaid Chart · 1 click
Get RevampKey to connect Mermaid Chart
RevampKey is a free desktop app for Mac, Windows and Linux. Install it, sign in, and Mermaid Chart is one click away with its skills already attached.
Download RevampKey
Not now? Use the skills in your current tool
for s in essentials diagram-draft-and-publish diagram-library-audit; do curl -fsSL --create-dirs -o .claude/skills/mermaid-chart-$s/SKILL.md https://revampkey.com/marketplace/mermaid-chart/skills/$s/SKILL.md done
Other tools

Into this project’s .claude/skills folder

Connect the Mermaid Chart MCP server in Claude Code.

Run this in your project folder to add all 3 skills:

for s in essentials diagram-draft-and-publish diagram-library-audit; do
  curl -fsSL --create-dirs -o .claude/skills/mermaid-chart-$s/SKILL.md https://revampkey.com/marketplace/mermaid-chart/skills/$s/SKILL.md
done

Ask in plain language, for example “Draw a flowchart of the checkout process including what happens when payment fails.”

Into the shared .agents/skills folder

Connect the Mermaid Chart MCP server in Cursor.

Run this in your project folder to add all 3 skills:

for s in essentials diagram-draft-and-publish diagram-library-audit; do
  curl -fsSL --create-dirs -o .agents/skills/mermaid-chart-$s/SKILL.md https://revampkey.com/marketplace/mermaid-chart/skills/$s/SKILL.md
done

Ask in plain language, for example “Draw a flowchart of the checkout process including what happens when payment fails.”

Into the shared .agents/skills folder

Connect the Mermaid Chart MCP server in Codex.

Run this in your project folder to add all 3 skills:

for s in essentials diagram-draft-and-publish diagram-library-audit; do
  curl -fsSL --create-dirs -o .agents/skills/mermaid-chart-$s/SKILL.md https://revampkey.com/marketplace/mermaid-chart/skills/$s/SKILL.md
done

Ask in plain language, for example “Draw a flowchart of the checkout process including what happens when payment fails.”

Into the shared .agents/skills folder

Connect the Mermaid Chart MCP server in VS Code.

Run this in your project folder to add all 3 skills:

for s in essentials diagram-draft-and-publish diagram-library-audit; do
  curl -fsSL --create-dirs -o .agents/skills/mermaid-chart-$s/SKILL.md https://revampkey.com/marketplace/mermaid-chart/skills/$s/SKILL.md
done

Ask in plain language, for example “Draw a flowchart of the checkout process including what happens when payment fails.”

RevampKey or copy the files?

In RevampKey

One click when you connect Mermaid Chart
Updated for you when a skill improves
Removed when you disconnect
The MCP server is set up for you
800+ other connectors, same way

Download free

Copy into your project

One command per project
Run it again to get updates
You connect the Mermaid Chart MCP server yourself
Works in Claude Code, Cursor, Codex and VS Code

See the command

Mermaid Chart skills FAQ

What is a Mermaid Chart agent skill?

A SKILL.md file: a short playbook an AI agent loads when your request matches it. Each Mermaid Chart skill describes one job, which Mermaid Chart tools to use in which order, what to check first and when to stop and ask you.

Do the Mermaid Chart skills change anything on their own?

The others tell the agent to show you the change and wait for a yes before it creates, edits or deletes anything in Mermaid Chart.

Which tools can use these skills?

Any agent that reads the open Agent Skills format: Claude Code, Cursor, Codex, VS Code with Copilot and RevampKey. In RevampKey they are attached when you connect Mermaid Chart; elsewhere you copy the folders into your project or skills directory.

Do I need the Mermaid Chart MCP server too?

Yes. The skills tell the agent how to do the work; the Mermaid Chart MCP server gives it the tools to do it. The Mermaid Chart MCP setup guide covers every client.

Mermaid Chart MCP server setup · This page as Markdown

Put Mermaid Chart’s best workflows in your agent

Download RevampKey, connect Mermaid Chart and ask your first question in about a minute.

Download RevampKey Connect Mermaid Chart · 1 click

All 3 Mermaid Chart skills

Use Mermaid Chart with AI

Use it when

Tools it uses

Draft and publish Mermaid diagrams with AI

Use it when

Tools it uses

Audit your saved Mermaid diagrams

Use it when

Tools it uses

Get all 3 without copying a file

How Mermaid Chart skills work

How to install Mermaid Chart skills

RevampKey or copy the files?

In RevampKey

Copy into your project

Mermaid Chart skills FAQ

Put Mermaid Chart’s best workflows in your agent

Skills for related tools