mermaid

• mermaid-js/mermaid
• Live Editor
• GitHub 和 Gitlab 支持 mermaid

caution

• 无法调整 rank #3723

type
graph	Flow
sequenceDiagram	Sequence
classDiagram	Class
stateDiagram-v2	State
gantt	Gantt
pie	Pie
erDiagram	ER
gitGraph	Git
journey	UserJourney
flowchart

gantt

API

<pre class="mermaid">
    graph LR
    A --- B
    B-->C[fa:fa-ban forbidden]
    B-->D(fa:fa-spinner);
</pre>

<style>
  div.mermaid {
    font-family: 'trebuchet ms', verdana, arial;
  }
</style>
<script type="module">
  import mermaid from 'https://unpkg.com/mermaid@9/dist/mermaid.esm.min.mjs';
  mermaid.initialize({ startOnLoad: true });
</script>