Mermaid to SVG converter
Paste Mermaid source above and export vector output that scales without blurring and can still be edited downstream.
SVG is the right default whenever the destination supports it: documentation sites, design tools, and print all read it, and the file usually stays smaller than a high-scale PNG.
How to convert Mermaid to SVG
- Paste your Mermaid source above and confirm the preview renders.
- Open the export options and choose SVG.
- Leave minification off while you are still editing, and turn it on for a smaller published file.
- Set the filename and download. The exported SVG carries a title and an accessible label describing the diagram.
SVG settings
| Property | What SVG does | What to watch |
|---|---|---|
| Scaling | Renders at any size without losing sharpness. | Very large diagrams still need a scrollable container. |
| Text | Stays real text, so it can be selected and searched. | A missing font on the reader machine is substituted. |
| Editing | Opens in vector editors for later changes. | Keep the .mmd source as the original you edit. |
| Accessibility | Carries a title and an aria-label from the diagram. | Rename the diagram if the generated label is vague. |
Fonts are referenced by name rather than embedded. If the SVG will be opened on machines that may not have your font, either stay on the default family or export PNG for a fixed appearance.
Frequently asked questions
Does the SVG keep my text selectable?
Yes. The export writes native SVG text rather than a picture of the text, so the labels can be selected, searched, and read by assistive technology.
Why does the SVG look different on another computer?
A font that is not installed on the reading machine is substituted, which changes the metrics. Use the default family, or export PNG when the appearance has to be identical everywhere.
Can I edit the exported SVG?
Yes, in any vector editor. Keep the Mermaid source as the editable original, because changes made in the SVG cannot be brought back into the diagram code.
Keep reading
Export guide · the example loaded above · all guides
mermaid.tools is an independent editor not affiliated with the Mermaid.js project or Mermaid Chart / mermaid.ai. Conversion runs in your browser with Mermaid 11.17.2; nothing is uploaded.