Mermaid¶

• mermaid - Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.
• Online FlowChart & Diagrams Editor - Mermaid Live Editor
• Diagrams - Material for MkDocs
• Creating diagrams - GitHub Docs
• marmaid.js: How to make lines angular instead of curved

entity relationship diagrams¶

Here is a simple flow chart:

mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
    D-->E;

graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
    D-->E;
    D-->B;

And here is a network flow diagram:

mermaid
sequenceDiagram
    Alice->>+John: Hello John, how are you?
    Alice->>+John: John, can you hear me?
    John-->>-Alice: Hi Alice, I can hear you!
    John-->>-Alice: I feel great!

sequenceDiagram
    Alice->>+John: Hello John, how are you?
    Alice->>+John: John, can you hear me?
    John-->>-Alice: Hi Alice, I can hear you!
    John-->>-Alice: I feel great!