What is Mermaid? (from the official docs)⌗

Mermaid is a Javascript based diagramming and charting tool that uses Markdown-inspired text definitions and a renderer to create and modify complex diagrams. The main purpose of Mermaid is to help documentation catch up with development.

Diagramming and documentation costs precious developer time and gets outdated quickly. But not having diagrams or docs ruins productivity and hurts organizational learning. Mermaid addresses this problem by enabling users to create easily modifiable diagrams, it can also be made part of production scripts (and other pieces of code).

Mermaid allows even non-programmers to easily create detailed and diagrams through the Mermaid Live Editor.

Example diagram:⌗

pie
    title Projects using a diagram DSL
    "Not using anything" : 70
    "PlantUML" : 20
    "Mermaid" : 10

⚠️ I did not check all the projects in the world. The numbers are for demonstration purposes...

Why is it so cool?⌗

It can be embedded within your markdown files on GitHub or Gitea for example.
A lot of other tools also support it!

Try it yourself!⌗

Create a folder called mermaid in your current directory, then run this in your command line:

docker run --rm -v ${PWD}/mermaid:/data:z felixlohmeier/mermaid -p <filename>

⚠️ (You need Docker to run this though…)
Check out our other post on getting-started-with-docker.