Merflow

A Mermaid editor that gets out of your way

Merflow turns Mermaid's text syntax into diagrams as you type — with a real code editor, real export options and zero setup. Free, no signup, and everything stays on your machine.

Writing

Monaco editor

The editor that powers VS Code, with Mermaid syntax highlighting, keyword and arrow autocompletion, and full starter snippets for every diagram type.

Inline error markers

A syntax error never breaks the view: the last valid diagram stays rendered, the failing line gets a red squiggle, and the overlay offers a one-click "Go to line" jump.

Syntax cheat-sheet

A built-in Mermaid reference covering flowcharts, sequence, class, state, ER, Gantt, pie, journeys, mindmaps, git graphs and timelines — with copyable, runnable snippets.

Command palette

⌘K / Ctrl+K for every action — export, templates, themes, documents — plus platform-aware keyboard shortcuts.

Viewing

Live preview

Debounced rendering keeps the preview instant without re-rendering on every keystroke. Pan by dragging, zoom toward the cursor, auto-fit or jump to 100%.

Code ↔ diagram sync

The nodes on your cursor's line glow in the preview; click a node and the editor jumps to its line.

Themes

Light and dark UI, plus an independent diagram theme — default, dark, forest, neutral, base and more.

Presentation mode

One shortcut hides all chrome for a full-bleed view of the diagram — ideal for meetings and screen shares.

Sharing & export

SVG & PNG export

Native SVG download, or PNG at 1×/2×/3× resolution with white, theme or transparent background. Copy either straight to the clipboard.

Links that carry the diagram

Share compresses the source into the URL itself — no accounts, no expiry, no server. Opening a link creates a new document, never overwriting your work.

Multi-document workspace

Create, rename, duplicate and switch between named diagrams — all persisted locally in your browser.

File support

Drag & drop .mmd, .mermaid or .txt files to open them; download your source as .mmd anytime.

Private by architecture

Merflow has no backend for your content. Rendering, storage and export all happen client-side; Mermaid runs with securityLevel: 'strict' and the generated SVG is sanitized before it touches the DOM. The interface is fully bilingual (English/Spanish) and accessible — ARIA roles, focus management and keyboard navigation throughout.

Frequently asked questions

Do I need an account to use Merflow?

No. Merflow runs entirely in your browser — no signup, no login, no server-side storage. Your diagrams are saved locally.

Where are my diagrams stored?

In your own browser (localStorage). Nothing is uploaded: the editor, the renderer and the export pipeline are all client-side.

How do shareable links work?

The Share button compresses your diagram's source and encodes it into the URL hash. Whoever opens the link gets the full diagram as a new document — no database involved.

How is Merflow different from Mermaid Live Editor?

Merflow adds Monaco autocompletion with inline error markers, a multi-document workspace, a bilingual EN/ES interface, a template gallery with rendered previews and a built-in syntax cheat-sheet — while staying free and local-first.