With Mermaid app you can easily create code-based diagrams inside Miro.
How to install the app
Install the app from Miro Marketplace or by following the link. You’ll need to select a Miro team to complete the installation.
⚠️ Non-admin users can’t install apps if this is not allowed in team settings.
Creating diagrams and adding them to Miro boards
As you install the app, you'll see it on your toolbar.
The app has a default sample code. As you change the code to build your diagram, the diagram is refreshed in the preview area on the right.
Changing a diagram code
The Mermaid app has several sample diagrams available at the bottom left corner - feel free to use the samples in your work.
Change the size of the code editor pane by dragging it from its right edge.
Changing the size of the code editor
To learn more about the Mermaid syntax, please refer to the official documentation. You can also access the documentation from the bottom left corner of the app panel.
As you finish building your diagram, click Add to board. The diagram will be added to the board as an image. You can download the image or share the board with the diagram with your collaborators.
Adding a diagram to the board