# Mermaid - Generation of diagrams and flowcharts from text in a similar manner as markdown

**URL:** <https://talk.commonmark.org/t/mermaid-generation-of-diagrams-and-flowcharts-from-text-in-a-similar-manner-as-markdown/1882>\
**Category:** Uncategorized\
**Created:** [October 11, 2015, 9:26am UTC](https://talk.commonmark.org/t/mermaid-generation-of-diagrams-and-flowcharts-from-text-in-a-similar-manner-as-markdown/1882 "2015-10-11T09:26:12Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![mofosyne](https://cdn.commonmark.org/user_avatar/talk.commonmark.org/mofosyne/32/1438_2.png) [@mofosyne](https://talk.commonmark.org/u/mofosyne)\
**Post date:** [October 11, 2015, 9:26am UTC](https://talk.commonmark.org/t/mermaid-generation-of-diagrams-and-flowcharts-from-text-in-a-similar-manner-as-markdown/1882/1 "2015-10-11T09:26:13Z")

</div>

Looks pretty interesting. It aims to be like markdown, but for diagrams.

[http://knsv.github.io/mermaid/](http://knsv.github.io/mermaid/)

* * *

Wonder how one would support this within commonmark, even if it’s as an extension hook. If using custom containers like in [https://markdown-it.github.io/](https://markdown-it.github.io/) , then it may look like this:

```auto

::: mermaid [Diagram Description/Title] :::
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
:::::::::::::::

```

---

_[View the full topic](https://talk.commonmark.org/t/mermaid-generation-of-diagrams-and-flowcharts-from-text-in-a-similar-manner-as-markdown/1882)._