# Diagrams and charts

> Render Mermaid flowcharts, sequence diagrams, and charts inline.

Source: https://notate.md/docs/writing/diagrams/

Category: Writing & Markdown

Updated: 2026-08-18

---

Notate renders diagrams right in your notes, so a process or a relationship can live next to the prose that explains it.

## Write a Mermaid block

Add a fenced code block with the language set to `mermaid` and write your diagram inside it. Notate renders it in Split and Preview modes: flowcharts, sequence diagrams, state diagrams, and charts are all supported.

## It stays plain Markdown

The diagram is stored as a plain `mermaid` code block in your file. That means it travels with the note, works in other tools that understand Mermaid, and never becomes a binary you can't edit. The [markdown guide](https://notate.md/markdown-guide/#diagrams) shows a rendered example.