close
close

Apre-salomemanzo

Breaking: Beyond Headlines!

Use Mermaid to create charts and diagrams without image editing tools
aecifo

Use Mermaid to create charts and diagrams without image editing tools


Have you ever tried to create an organizational chart, or any other type of diagram, using image editing software or a word processor’s built-in tools? This usually doesn’t go well, which is why there is dedicated software for this job. But long-standing options like Mirosoft Visio are not easily accessible to the average person, and Lucid Charta web-based alternative, limits free users to 60 “shapes” per document, after which you’ll pay $9 per month.

It’s reasonable if you’re the type of person who constantly creates flowcharts, but it’s a lot to ask for casual use. If you’d rather avoid paying for another subscription and are willing to learn a little Markdown (basically, a way to add formatting without a text editor or HTML tags), Siren is an open source tool that can be used to create such graphics using plain text.

The easiest way to start is to head over to Mermaid.live. This is a free online tool that allows you to create flowcharts and a number of other diagrams right in your browser. It offers a number of example diagrams, found in the left column, and playing with a few of them is a great way to get familiar with the tool. It includes flowcharts, as well as productivity favorites like Gantt charts and pie charts.

A pie chart made using Mermaid, using only four lines of text.


Credit: Justin Pot

The left panel is where you place the text and the right panel shows a preview of the chart. If you’ve used another Markdown editor before, it will feel familiar, even if the details take some time to remember. If you’ve never used Markdown before, there is a bit of a learning curve: determining how to best use this tool will require either experimenting in Mermaid itself, read the documentationor both.

Once created, you can export your charts from this web tool as an image, if you wish, or copy the code for use in another application. A number of applications, including Obsidian, Notion, and GitLab, include support for integrating Mermaid code. (Read the list of integrations to learn about other tools that support Mermaid and other creative tools within it.)

If you are an experienced user of flowcharts and diagramming tools, Mermaid will not replace more robust programs designed for this task. But if you only need to create a chart occasionally, and especially if you prefer to work with text-based tools, this can save you time and money.