In short:
ak-mermaidjs-v11writes diagrams for your docs in Mermaid v11 syntax, which is text, so you edit and review it like code. By default it only gives you amermaidblock to paste into Markdown and installs nothing. It exports SVG, PNG or PDF only when you need an image file, and always opens the file to check it.
Disclosure: I maintain AgentKit and have an affiliate relationship with it: the AgentKit link in this post is an affiliate link; buying through it gets you 30% off.
Summary
Use it when your docs need a diagram: a process flow, an API call sequence, a database schema, a project timeline. You do not need it when you want a publication-quality diagram instead of a Mermaid one; that is the job of ak-tech-graph.
flowchart LR
A["Describe the diagram to draw"] --> B["ak-mermaidjs-v11"]
B --> C["mermaid block in Markdown"]
B --> D["SVG, PNG, PDF file"]
D --> E["Layout review per ak-tech-graph"]It always considers 4 points:
| Point | Question | Example |
|---|---|---|
| Diagram type | What are you trying to show? | Call order uses sequenceDiagram, table relations use erDiagram, timelines use gantt |
| Render in place or export a file | Where will the diagram be viewed? | A GitHub README only needs a mermaid block; slides or Word need an image exported with mmdc |
| Config inside the diagram | Want to restyle one diagram without touching the shared config? | Frontmatter theme: dark, look: handDrawn or layout: elk at the top of the block |
| What the renderer supports | Can the place you paste into draw this syntax? | Checked before using architecture-beta with an icon pack |
The more clearly your description names the parts and how they relate, the fewer fixes the diagram needs.
Sample prompt for a process flow in a README:
/ak-mermaidjs-v11 flowchart for the order approval flow of <app name>:
new order -> check stock -> in stock goes to payment, out of stock notifies the customer.
Put it in README.md under "Order flow". Use meaningful node IDs and label the arrows.This skill has no flags. After the command name, you write the diagram type (such as flowchart, sequenceDiagram, gantt) or describe in words what you want to draw.
Below is the detailed version: the run flow, 5 situations with prompts, how to write the input, the change history by ak release, and common pitfalls. The detailed version and the interactive page are for subscribers. Your agent can also search them through the portal's MCP.
Opens when your account has subscriber access
This guide is for subscribers
Once your account has access, the full piece, the interactive visual and the agent call all open.
- Sign in or create a modernEngineer accountReading access belongs to your account email.
- Choose a plan on the pricing page1, 3 or 12 months, paid by VietQR bank transfer. Access opens about a minute after the money arrives.
- Or redeem a Facebook subscriber codePeople supporting the page on Facebook get an activation code by message each month.
Already a subscriber? Sign in to read.
Use this piece in your agent
Get an API keyCopy the text below and paste it into Claude Code, Codex or whichever agent you use. The agent reads the piece and checks it against the repo you have open.
Read "ak-mermaidjs-v11: draw Mermaid v11 diagrams inside Markdown" on modernEngineer and apply it to this repo.
1. Call the content_get tool of the modernengineer MCP server with locale "en", slug "ak-mermaidjs-v11". If the modernengineer MCP server is not connected, stop and walk me through connecting it from https://modernengineer.dev/en/mcp.
2. Summarize the main steps of the piece and point out which apply to this repo.
3. Propose concrete changes and ask me before editing any file.Connect MCP in Claude Code (once)
claude mcp add --transport http modernengineer \
https://api.modernengineer.dev/mcp \
--header "Authorization: Bearer <API key>"Reading the full piece over MCP needs an API key from a subscriber account or one that bought this guide. Without access, the agent only gets the opening.
- Version
- v1.0.0
- Updated
- 22/10/2026
- Licence
- All rights reserved
- Slug
- ak-mermaidjs-v11
