Mermaid diagrams
Keep the diagram beside the explanation.
Add a Mermaid code block to Markdown and inspect the rendered flow in Preview—without leaving the document for a separate canvas.
Built for the document
Text remains the source of truth.
A diagram can be versioned, copied, and understood alongside the prose that gives it meaning. Rendering is a view of that source, not a separate asset to reconcile.
Plain-text source
Mermaid syntax lives in a fenced code block inside the Markdown document.
Rendered preview
Supported flowcharts, sequences, and other Mermaid diagrams render in Preview.
Fits technical writing
Explain a system and show its path in the same portable file.
Recoverable errors
Invalid syntax reports a scoped preview error while source editing stays available.
```mermaid
flowchart LR
Draft --> Review
Review --> Publish
```Useful details
Questions, answered
Which Mermaid diagrams work?+
Glyphmark uses Mermaid’s renderer. Support follows the installed Mermaid version and the syntax accepted by that renderer.
What happens when the syntax is invalid?+
The preview reports the rendering problem without removing or replacing the source block.
Is the diagram stored separately?+
No. The Mermaid text stays inside the Markdown document.
Ready when you are