Mermaid

Creating diagrams with Mermaid

Summary

Text-based diagrams.

Mermaid diagrams for flowcharts, sequence diagrams, and other visualizations. Diagrams automatically adapt to light/dark theme.

```mermaid
graph TD
    A[Start] ==> B{Is it working?}
    B ==>|Yes| C[Great!]
    B ==>|No| D[Debug]
    D ==> B
    C ==> E[End]
```

result:

Important

Due to MDX parser limitations, use ==> instead of --> for arrows in flowcharts.


Sequence diagrams (avoid -->> because it contains --> and will be stripped):

```mermaid
sequenceDiagram
    participant User
    participant Browser
    User->>Browser: Click button
    Browser->>User: Display result
```

result: