How to view Mermaid diagrams in Markdown
A Markdown report can contain a flowchart without containing an image. Mermaid stores the diagram as text: the boxes, arrows and labels become a picture when a compatible reader opens the file.
To read it in Easy Markdown, open your .md file or paste the Markdown. Diagrams appear in place, with the paragraphs that explain them. It’s free, with no account or installation. Opening a file or pasting Markdown keeps the document in your browser; the app does not upload it.
From diagram code to a readable plan
This is a complete Mermaid block inside a Markdown document:
```mermaid
flowchart LR
A[Gather evidence] --> B[Compare options]
B --> C[Choose a direction]
C --> D[Test the idea]
```
Rendering diagram…
The word mermaid after the opening backticks tells a supporting reader how to interpret the block. Without that label, it is an ordinary code example. GitHub uses this same fenced-block convention for diagrams.
Mermaid also describes sequence diagrams, mind maps, Gantt charts and other structures. Our reader is designed for a diagram within a document: the explanation stays next to the picture.
Look closer without losing the document
Wide diagrams become hard to read when every box is squeezed into a narrow page. Choose Expand diagram to open the larger view. Zoom in for the labels, drag to follow the arrows, and use Fit to see the whole diagram again.
Use the zoom buttons, a mouse wheel or a pinch gesture. Keyboard users can focus the diagram area, move with the arrow keys and press Escape to return. Copy Mermaid copies the diagram’s source if you want to reuse it or ask your AI to change it.
Why does a Mermaid diagram show as code?
A reader can support Markdown without supporting Mermaid. If you see lines such as flowchart LR and A --> B, the diagram may be intact; the app may simply be displaying its source.
In Easy Markdown, check that the block begins with three backticks followed by mermaid. If you pasted an entire document wrapped in another code fence, that outer fence also makes the content appear as code. Remove only the outer wrapper and keep the diagram’s own fence.
A rendering error is different. It means the block was recognized, but couldn’t be drawn. Use View Mermaid source and check the error with your AI or the Mermaid documentation. An invalid diagram leaves the rest of the document readable.
Support and limits
Easy Markdown renders Mermaid blocks inside .md, .markdown and .txt documents. It does not open standalone .mmd files, edit diagrams or export them as images. For authoring and export, Mermaid Live is a separate option.
Embedded image/icon shapes and custom Mermaid configuration are not supported here. A diagram is limited to 20,000 characters and 300 connections; local documents can be up to 256 KiB. Links inside diagrams cannot be clicked. Embedded image shapes stay off so they cannot load content from another site.
If your AI gives you an Easy Markdown reader link, it uses a different route: the agent sends the document to our API, and anyone with the returned link can read it. See how privacy works before using that route for sensitive material.