Features
Everything the add-on can do — and why each feature exists.
Insert Mermaid Diagram
Opens a full-featured side-by-side editor with live preview. Write or paste Mermaid syntax on the left, see the rendered diagram update in real time on the right. Choose from built-in templates to jump-start any diagram type.
Edit All Mermaid Diagrams
Lists every Mermaid diagram in your document as a card with a thumbnail preview. Expand any card to reveal an inline editor with a live preview panel — edit the Mermaid source on the left, see the rendered diagram update in real time on the right. Save & Replace writes the updated diagram back to the document without leaving the dialog.
Edit Selected Mermaid Diagram
Click on any Mermaid diagram that was inserted by this add-on, then run this command. The editor opens pre-loaded with the diagram's source code so you can tweak and re-render without starting over.
Convert All Code to Diagrams
Scans your entire Google Doc™ for Mermaid code blocks — both native Code Snippet elements and fenced ```mermaid blocks — and renders every one as a high-quality diagram. You preview each diagram before choosing to Insert (after the code) or Replace (swap the code block).
Convert Selected Code to Diagram
Select a single code block or fenced Mermaid block and convert just that one. Useful when you want to render one diagram without scanning the whole document.
Convert All Diagrams to Code
Every diagram inserted by this add-on embeds the original Mermaid source in its alt text. This command scans the entire document and replaces every diagram with a fenced mermaid code block containing the original source.
Convert Selected Diagram to Code
Click on any Mermaid diagram that was inserted by this add-on, then run this command. The diagram is replaced with a fenced mermaid code block containing the original source — ready to edit, share, or convert back to a diagram.
Markdown Import & Export
Paste raw markdown into the import dialog. The add-on parses it, renders any Mermaid code blocks as diagrams, and inserts the formatted content into your Google Doc™ — including headings, lists, tables, inline code, and native checkboxes.
Export as Markdown
Converts your entire Google Doc™ to markdown. Headings, lists, tables, and formatting are preserved. Mermaid diagrams are automatically converted back to fenced code blocks by extracting the source from the image's alt text.
Fix Native "Copy as Markdown"
The one feature you didn't know you needed — until Google Docs™ breaks your diagrams.
The Code Snippet Problem
Google Docs™ has a built-in Code Snippet block (Insert → Code block). It looks great for displaying code, but it has a critical flaw: when you copy text from a markdown file, a README, or any external source and paste it into a Code Snippet, Google Docs™ silently corrupts the content.
\v)
Newlines inside pasted code blocks are replaced with vertical tab characters (U+000B). These are invisible but break Mermaid parsing completely.
Fenced code block markers (```mermaid) survive the paste and wrap lines that shouldn't have them, producing invalid syntax.
Rich-text formatting from the source (bold, italic, links) can inject invisible Unicode characters or extra whitespace that Mermaid doesn't expect.
How it works
Paste your corrupted code into the tool. It automatically:
- Replaces all
\v(vertical tab) characters with proper newlines - Strips stray backtick fences that wrapped individual lines
- Removes invisible formatting artifacts
- Shows a side-by-side diff so you can see exactly what changed
Copy the fixed result and paste it back into your doc — it's now valid Mermaid syntax, ready to render.
🔒 Privacy by design
Zero data collection. Zero cookies. Zero telemetry. Zero servers. Your documents never leave your browser — rendering is 100% client-side via Mermaid.js and Marked.js. The only external requests are loading these libraries from jsDelivr.
Read Privacy Policy →