Diagram

Mermaid flowcharts and arrow chains, laid out.

On your clipboard
Copy → Decide → Render → Paste

Have Peesuto? Copy the sample, then press ⌥V in any text field to get this card.

Pasted with ⌥V ↩ Diagram card made from the sample text, in the Flow style.

2 styles

Switch after pasting, or pick a default in Settings › Templates.

Diagram card in the Flow style.
Flow
Diagram card in the Blueprint style.
Blueprint

Square or wide

Images fit their content by default; choose 1:1, 4:5, 16:9 or 9:16 for any output. Content that does not fit a fixed frame grows the image, or scrolls in a GIF or video; nothing is cut.

Diagram, 1:1.
1:1
Diagram, 16:9.
16:9

In motion

Press G in the chooser for a GIF or M for an MP4: the same card, revealed in reading order. The video needs ffmpeg on your Mac.

How Peesuto recognises it

A Mermaid flowchart (graph or flowchart, fenced or bare), or lines like “A → B → C”. It wins over every other structure; the nodes are laid out and the arrows routed.

The exact rules are in docs/templates.md.