Paste Mermaid code on the left and the diagram renders on the right — free, in your browser, no signup. Flowchart, sequence, state, Gantt, pie, class and the rest of the Mermaid syntax, exported as PNG or SVG.
Mermaid diagrams inside .md files on your Mac? MacMD Viewer renders them offline, in the app and in Finder Quick Look.
A Mermaid diagram viewer renders Mermaid's text-based diagram syntax into visual charts in real time. Instead of drawing boxes and arrows by hand, you describe a flowchart, sequence, state, Gantt, pie, or class diagram in plain-text Mermaid syntax and see it rendered instantly.
Type or paste Mermaid code on the left and the diagram appears on the right as you edit. When it looks right, export it as a high-resolution PNG, a scalable SVG, or copy the SVG markup straight into Figma, a README, or a slide deck. All rendering runs locally in your browser with Mermaid.js — your diagram code is never sent to a server.
Yes. The Mermaid viewer is completely free with unlimited diagrams, no account, no watermarks, and no hidden fees.
All rendering happens in your browser using Mermaid.js. Your diagram code is never sent to any server.
Flowcharts, sequence diagrams, state diagrams, Gantt charts, pie charts, and class diagrams. All standard Mermaid syntax is supported.
Yes. You can download diagrams as PNG (raster) or SVG (vector), or copy the SVG markup to your clipboard for use in other tools.
Both use the same Mermaid.js library for rendering. This tool is lighter, loads faster, and includes one-click PNG/SVG export. For rendering Mermaid diagrams inside Markdown files on Mac, try MacMD Viewer.
MacMD Viewer