Open the Vootkit workspace.
01Diagram Maker
Turn Mermaid text into flowcharts and diagrams.
- 1Choose toolOpen the Vootkit workspace.
- 2Add inputProvide the content or settings.
- 3ProcessLet the browser do the work.
How to use Diagram Maker
Provide the content or settings.
02Let the browser do the work.
03Copy, download or continue.
04Your files stay private
Your work is processed locally in your browser where possible and is never added to a Vootkit upload library.
Learn more about privacyDiagrams drawn by hand in a graphics editor are painful to change, and they always need changing. Describing the diagram in text and letting software lay it out means editing is a one-line change rather than a redraw.
What Diagram Maker does
Renders Mermaid syntax — flowcharts and sequence diagrams — from a text description. You write the relationships; the layout is computed.
Because the source is text, it can live in a document, a README or version control, and a diff shows exactly what changed.
Syntax and use
| Language | Mermaid |
|---|---|
| Diagram types | Flowchart, sequence diagram |
| Layout | Computed automatically — you do not position anything |
| Source is | Plain text — versionable and diffable |
| Editing | Change a line, the layout re-flows |
| Also supported by | GitHub, GitLab, Notion and many docs tools |
| Runs | In your browser |
| Best for | Process flows, decision trees, API interactions |
Detailed steps
- Start with
flowchart TDfor top-down, orsequenceDiagramfor interactions. - Describe nodes and arrows one relationship per line.
- Let the layout resolve itself rather than fighting it.
Worth knowing
Because Mermaid renders natively on GitHub, GitLab and several documentation platforms, a diagram written here can be pasted straight into a README and stay editable there. That is the real advantage over an exported image — the diagram in your docs never drifts out of date because updating it is a text edit rather than a redraw.
Frequently Asked Questions
Why Mermaid rather than drawing?
Because diagrams change. A drawn diagram is re-drawn every time the process shifts; a text description is a one-line edit and the layout recomputes. It also lives in version control, so changes are visible in a diff.
Which diagram types work?
Flowcharts and sequence diagrams — the two that cover most process and interaction documentation. Flowcharts for decisions and steps, sequence diagrams for who calls whom in what order.
Can I control the layout?
Only loosely — direction and grouping, not exact positions. That is deliberate: automatic layout is what makes editing cheap. If you need pixel control, you want a drawing tool and the maintenance burden that comes with it.
Where else can I use the same code?
GitHub and GitLab render Mermaid in Markdown, as do Notion and many static site generators. The same block works in all of them.
Is Diagram Maker free?
Yes. The Vootkit free plan includes 5 tool runs a day. Upgrade to Vootkit Pro for unlimited daily use, an ad-free workspace and saved workflows.
Are my files uploaded?
No. Diagram Maker runs entirely in your browser — your file is processed on your own device and never sent to a server. There is nothing for us to store or delete.
Do I need to install anything?
No. Diagram Maker works in any modern browser on desktop, tablet or phone. Open the page and start.
How often can I use it? Is there a daily limit?
On the free plan you get 5 tool runs a day. When you reach the limit you'll see a prompt to upgrade, and it resets the next day. Vootkit Pro removes the cap entirely for unlimited daily use.
Recently viewed
This tool processes everything locally in your browser. You can disconnect from the internet after the page loads and it will still work.