Twain
Fenced blocks become diagrams

Mermaid diagrams, rendered where the Markdown lives

Flowcharts, sequence and state diagrams from mermaid fences appear as real diagrams, in the app and in the Finder preview, with no dev server and no network.

The short version

Modern engineering docs assume Mermaid: agents emit it, GitHub renders it, and most Mac Markdown apps show it as a grey block of syntax. Twain renders mermaid fences as real diagrams, offline, in the app window and in the Finder Quick Look preview, using the same pipeline everywhere.

Diagrams as the author intended

The diagram types agent-written and repository docs actually use.

flowcharts

Graphs and flowcharts Free

graph and flowchart fences render as proper diagrams, styled to sit comfortably in the document around them.

sequence · state

Sequence and state diagrams Free

Sequence diagrams, state machines and the rest of Mermaid's standard set render the way modern engineering docs assume.

space bar

Diagrams in Quick Look Free

The Finder preview uses the same renderer, so a spacebar preview shows the diagram, not the source that describes it.

review-safe

Diffs that ignore re-render noise Free

Show Changes identifies a diagram by its source, not its rendered SVG, so a Mermaid re-render never shows up as a phantom change in review.

offline

Nothing leaves your Mac Free

Rendering is local. A diagram in a private document is never sent anywhere to be drawn.

highlighted fences

Code blocks stay readable Free

Non-Mermaid fences get syntax highlighting for dozens of languages, so mixed documents read well end to end.

architecture.md · the fence in the file
```mermaid
flowchart LR
  Agent[Coding agent] --> Docs[docs/*.md]
  Docs --> Twain{Twain}
  Twain --> You[You]
  You --> Brief[Agent brief]
```

  ▸ in the app and in Quick Look, this fence renders as the diagram it describes

Agents write Mermaid. Most viewers recite it.

Mermaid is the one diagram language that lives inside Markdown, which is exactly why coding agents produce it constantly: an architecture sketch or a state machine costs an agent a fenced block. Reading it back is the hard part. A viewer that shows the fence as plain code makes you the compiler; Twain draws the diagram in place.

One engine, no drift

The app window and the Finder Quick Look preview run the identical renderer, so a diagram never depends on which surface you used to open the file. In Show Changes, a diagram's identity comes from its source text, so re-rendering noise is invisible and an edited diagram is flagged precisely.

Questions

Which Mermaid diagram types render?

The standard set Mermaid itself ships: flowcharts and graphs, sequence diagrams, state machines and their siblings. Flowcharts and sequence diagrams are what agent-written docs use most, and they render exactly as GitHub draws them.

Do diagrams render in the Finder preview?

Yes. Quick Look runs the same renderer as the app, so pressing space on a file shows its diagrams drawn, not the fence source.

Is my diagram sent to a server to render?

No. Rendering is entirely local and works offline. Nothing in a document is transmitted to draw it.

What happens to diagrams in Show Changes?

A diagram's identity comes from its Mermaid source, so an unchanged diagram never appears as a change no matter how often it re-renders, and an edited one is marked as exactly one changed block.

This page describes what the app does today; when a capability is partial or pending, it says so. See how Twain compares to other Mac Markdown apps.

More capabilities

Markdown viewer Review and agent loop CLI and MCP server All capabilities

Try Twain

The free viewer, with a 7-day Pro trial built in.