To preview Mermaid in Neovim, use a Markdown preview plugin that includes Mermaid, such as markdown-preview.nvim. Open a .md file and run :MarkdownPreview. The diagram renders in a browser beside Neovim; syntax highlighting in the editor alone does not render it.
If you only need to inspect one document, save it and open the file in mdview.io. For a preview that follows your edits, configure the plugin below.
If you already use lazy.nvim, add this plugin specification to your existing plugin list:
{
"iamcco/markdown-preview.nvim",
cmd = { "MarkdownPreview", "MarkdownPreviewStop", "MarkdownPreviewToggle" },
ft = { "markdown" },
build = function()
vim.fn["mkdp#util#install"]()
end,
}This uses the plugin's prebuilt installation route. Run :Lazy sync, let installation finish, and reopen your Markdown file. If the binary installation fails on your platform, use the Node.js installation alternative in the plugin installation instructions.
Do not replace your entire Neovim configuration with this snippet. It is one entry in a plugin list, and its location depends on how your configuration loads lazy.nvim.
Save the following as diagram-test.md. Keep the opening and closing fences: the plugin needs them to distinguish a diagram from ordinary text.
# Release workflow
```mermaid
graph LR
Draft[Draft] --> Review[Review]
Review --> Publish[Publish]
```Open the file, then run:
:MarkdownPreviewThe browser should show three connected boxes below the heading. Change Review to Approve and check that the preview updates. Stop it with :MarkdownPreviewStop when you are finished.
| Symptom | What to check |
|---|---|
MarkdownPreview is not an editor command |
Confirm the plugin installed and loaded; inspect its status in lazy.nvim. |
| The file opens as plain text | Run :set filetype?. A .md buffer should normally report markdown. |
| The preview shows a code block | Check the fence label is exactly mermaid, then try the complete test file above. |
| A simple diagram works but the real one fails | Reduce the failing diagram and check syntax or Mermaid version differences. |
| No browser window opens | Check browser availability and the plugin's browser settings, especially under SSH or WSL. |
To diagnose filetype detection temporarily, run :set filetype=markdown. If that fixes preview, correct your file naming or filetype configuration rather than changing the document's diagram syntax.
For a browser that does not open automatically, set vim.g.mkdp_echo_preview_url = 1 in your configuration and retry. Remote Neovim sessions need a reachable preview address and a browser on the machine where you want to view it; they do not automatically share localhost with your laptop.
A .mmd file contains diagram source without Markdown fences. For an image export, use the Mermaid CLI workflow instead of assuming a Markdown plugin recognizes the file.
A terminal Markdown renderer can make prose and code easier to read, but its treatment of Mermaid depends on that tool. Test diagram support separately from text formatting. See terminal Markdown reader options if your main task is reading READMEs in the shell.
After the small example works, check your actual document's tables, local images, and every diagram. A plugin preview and the destination where you publish can use different Mermaid versions. Keep the original source and compare the same small failing block in each renderer; the Mermaid compatibility guide explains that failure pattern.
For a document review outside the editor, save your file and open it in mdview.io. You can inspect the rendered document before deciding whether to export or share it.