Guide

How to import a draw.io file into Mermaid

Step-by-step guide to importing a .drawio or .xml file into Beauty Diagram, converting it to Mermaid, and beautifying the result for docs and decks.

Follow the workflow, open the example in the editor, then export or save the cleaner result.

At a glance

A guide for draw.io users who want to move onto a text-based, beautified Mermaid workflow.

Export the draw.io file in the right formatUpload the file and confirm the conversionBeautify and export the resultWhere this guide fits

Export the draw.io file in the right format

Open the diagram in draw.io and export it as XML. Either the native .drawio file or an uncompressed .xml export works — the editor parses both.

  • File → Export as → XML
  • Uncompressed XML is the most reliable option
  • Single-page diagrams import cleanly; multi-page files should be split first

Upload the file and confirm the conversion

Open the editor, drop the file into the upload area, and review the detected diagram type before confirming. The file is converted to Mermaid source you can edit directly.

Beautify and export the result

Once the Mermaid source is generated, use the beautify step to get a cleaner layout, then export SVG or PNG. You can keep iterating on the Mermaid source — no need to re-upload the original draw.io file.

Where this guide fits

draw.io import is a Pro feature. Use this guide when your team is moving away from maintaining diagrams inside draw.io and wants the source tree to own the diagrams going forward.