Home / Design / Diagram Maker (Mermaid)

Diagram Maker (Mermaid)

Write flowcharts, sequence, class, ER, Gantt, mind map and timeline diagrams as text and save them as SVG or PNG.

Free, no uploads, no sign-up. Runs 100% in your browser.

How Diagram Maker (Mermaid) works

The Mermaid engine reads your text and draws the diagram as SVG in your browser, again each time you stop typing. Labels are drawn as plain SVG text so the PNG export looks the same as the preview.

Input: Text, MMD. Output: SVG, PNG, JPG.

How to use Diagram Maker (Mermaid)

  1. Pick a starting template.
  2. Edit the text and watch the diagram update.
  3. Pick dark, light or print colours.
  4. Download SVG, PNG or JPG.

Tips

  • Generated CSS works in every modern browser.
  • Exports are produced locally, so you can work offline.

Diagram Maker (Mermaid) FAQ

Are my files uploaded?
No. This tool runs entirely in your browser tab. Files are read from your disk into memory and the result is generated locally.
Is it free? Are there limits or watermarks?
Free and open source (MIT). There are no file-size caps, daily quotas, accounts or watermarks.
Does it work offline?
Yes, once the page (and any engine it needs) has loaded, it keeps working without a connection thanks to the service worker cache.

Related tools

  • Sketch Whiteboard: Infinite whiteboard with shapes, arrows, text and sticky notes.
  • SVG Optimizer: Minify SVGs, export JSX or PNG.
  • Chart Maker: Paste data and make bar, line, area, pie, donut and scatter charts, then save them as SVG or PNG.
  • Color Palette Extractor: Extract dominant colors and export CSS/Tailwind palettes.

OpenFile runs in your browser. Turn on JavaScript to use the tools.