Mermaid to SVG
Paste Mermaid code and download the diagram as an SVG: a vector file that stays sharp at any size and is small enough for websites and documentation.
How to use the Mermaid to SVG converter
- Paste your Mermaid code or pick a template.
- Choose a theme and style; check the preview.
- Turn on Transparent to leave out the background.
- Click SVG to download the file.
What you get
- Vector lines and text: sharp at any zoom
- Fixed width and height, ready to embed
- Your theme and hand-drawn style
- Optional transparent background
About the Mermaid to SVG converter
SVG or PNG?
SVG is best for websites, documentation and anything that is zoomed or printed large. PNG is best where SVG is not accepted, such as some chat apps, email and older Office versions.
Text in the file
Labels are kept as real text, so they stay searchable. Browsers show the file exactly like the preview; some design tools show wrapped labels differently, so use PNG there.
Frequently asked questions
- Can I put the SVG on my website?
- Yes. Use it in an img tag or inline. It has a fixed size and a viewBox, so it scales with CSS.
- Will the SVG open in Figma or Illustrator?
- Usually yes, but some tools draw wrapped labels differently. If text looks off, use a 4x PNG.
- Is my diagram uploaded?
- No. The SVG is made in your browser.