← Back to Docs

Mermaid.js Charts

Render diagrams and flowcharts on the fly inside your markdown using Mermaid.js syntax.

Syntax Example

Declare your diagrams inside standard code fences using the mermaid identifier:

```mermaid
graph TD
    A[Launch Editor] --> B{Select Storage}
    B -->|Local Folder| C[Edit Local Files]
    B -->|GitHub| D[Push Commit Sync]
    B -->|Browser| E[Draft IndexedDB]
```

Rendering Live Flowcharts

The editor parses and compiles these declarations inside the preview pane. You can write complex flowcharts, sequence diagrams, state diagrams, class relationships, and Gantt tracking charts directly in plain text.