Generate a diagram with AI
Mermaid AI turns plain language into diagram syntax. Describe what you want to show (a process, a system, a flow) and it generates a working diagram. Refine it conversationally from there, or take over in the text editor once you have a structure you like.
This guide covers generating from a prompt, uploading a file, and refining results. If you want to write the syntax yourself, start with Create your first diagram →
Before you start
Mermaid AI is available on all plans. Credit amounts vary by plan: check your balance under Settings → Credits. Compare plans →
Generate a diagram from a prompt
- Go to your dashboard.
- Click New diagram.
- Select Mermaid AI from the left panel.
- Describe the diagram you want.
- Click Generate.
Writing a good prompt
Mermaid AI responds well to prompts that include three things: the diagram type, the subject, and the key elements or relationships you want shown. Diagram type + subject + key elements:
| Instead of… | Try… |
|---|---|
| ”A diagram of our hiring process" | "A flowchart of our hiring process — stages are application review, phone screen, technical interview, final interview, and offer. Include a rejection path at each stage." |
| "Show how our API works" | "A sequence diagram showing how a mobile app authenticates with our API using OAuth — actors are the app, the auth server, and the resource server." |
| "Our team structure" | "A flowchart org chart with a CEO at the top, three VPs below (Engineering, Product, Marketing), and two direct reports under each VP.” |
More examples by diagram type:
| Diagram type | Example prompt |
|---|---|
| Flowchart | ”A flowchart for a content production workflow: stages are brief, draft, review, revision, approval, and publish. Include a revision loop back to draft on rejection.” |
| Sequence diagram | ”A sequence diagram showing how a user resets their password: actors are the user, the web app, and the email service.” |
| ER diagram | ”An entity relationship diagram for a SaaS product with users, organizations, subscriptions, and invoices. Show the relationships and cardinality.” |
| Gantt chart | ”A Gantt chart for a three-month website redesign: phases are discovery, design, development, QA, and launch.” |
| Mindmap | ”A mindmap of a content marketing strategy: branches for channels, formats, distribution, and measurement.” |
| State diagram | ”A state diagram for an order management system: states are pending, confirmed, processing, shipped, delivered, and cancelled.” |
Generate from a file
Already have something written down? Upload it and let Mermaid AI extract the structure.
- Open the Mermaid AI panel.
- Click the attachment icon in the prompt input.
- Upload your file — supported formats include PDF, Word, and plain text.
- Tell Mermaid AI what to do with it.
Works well with:
| File type | What to ask for |
|---|---|
| Meeting notes | ”Turn these into a flowchart of action items and owners” |
| PRD or spec | ”Generate a sequence diagram showing the main user flows described here” |
| Process documentation | ”Create a flowchart of the steps outlined in this document” |
| Org documentation | ”Build an org chart from the team structure described here” |
Mermaid AI retains the context from uploaded files across the conversation. If you upload a PRD and generate a sequence diagram, you can follow up with "now show me the error states" or "add the admin flow" without re-uploading. The context stays live for the duration of the chat.
Refine the result
If the first result isn’t right, keep the conversation going. Mermaid AI understands the diagram it just generated — ask for targeted changes without starting over.
Add or remove elements:
| What you want | How to ask |
|---|---|
| Add a step | ”Add an ‘Under legal review’ step between ‘Approved’ and ‘Published‘“ |
| Remove a node | ”Remove the ‘Notify manager’ step” |
| Add a decision branch | ”Add a rejection path from ‘Review’ back to ‘Draft‘“ |
| Add a subgraph | ”Group the three database nodes into a subgraph called ‘Data layer’” |
Change structure or layout:
| What you want | How to ask |
|---|---|
| Change direction | ”Make it flow left to right instead of top to bottom” |
| Change diagram type | ”Convert this to a sequence diagram” |
| Simplify | ”This is too complex — collapse the middle section into a single node called ‘Internal processing‘“ |
| Split into sections | ”Break this into two subgraphs — one for the frontend flow and one for the backend” |
Adjust styling:
| What you want | How to ask |
|---|---|
| Color specific nodes | ”Make the decision nodes yellow and the endpoint nodes green” |
| Highlight a path | ”Make the critical path arrows thick” |
| Apply a theme | ”Apply the forest theme to the whole diagram” |
Review changes before applying
If a diagram has syntax errors and won’t render, open the Mermaid AI panel and click Fix with AI. It identifies the issue, proposes a fix, and shows you a diff before applying.
Useful when you’ve been editing syntax manually and something breaks mid-edit — faster than hunting through the code yourself. Review it, then click Apply to confirm or Discard.
Switch to the text editor
Once the diagram looks close, switch to the text editor to make precise adjustments. Everything Mermaid AI generates is standard Mermaid syntax — you own it completely and can edit it directly.
The AI panel and text editor stay in sync. Changes in either are reflected in the other.
New to Mermaid syntax? Read the syntax guide →
Common questions
-
The wrong diagram type was generated. Specify the type explicitly in your prompt: “Create a sequence diagram showing…” Without it, Mermaid AI infers the type from context, which is usually right but not always.
-
The diagram is too complex. Tell it directly: “This is too detailed — simplify it and collapse the middle section.” It adjusts without regenerating from scratch.
-
A key element is missing. Ask for it specifically: “You’re missing the approval step between review and publishing — add it between those two nodes.” Targeted requests get targeted fixes.
-
The layout doesn’t read well. Ask Mermaid AI to change the direction: “Make this flow left to right” or “Switch to top-down layout.” Direction has a significant impact on readability for complex diagrams.
-
I’m out of credits. Credits refill annually with your plan. To add more or upgrade, go to Settings → Credits or see plan options.
What’s next?
- Apply a theme or define custom node colors | Apply a theme →
- Export as PNG, SVG, or send a live link | Share your diagram →
- Learn the syntax to edit and build from scratch | Write diagram syntax →