Mermaid diagrams
A fenced code block with the language mermaid becomes a standalone SVG
image during build, check, and serve. Rendering is built into ckdocs;
there is no browser script, network request, or external rendering tool.
The HTML selects a light or dark SVG to match the reader's colour scheme.
Repeated diagrams share their generated assets under _ckdocs-mermaid/,
a reserved output directory. The site works offline and under URL prefixes.
Write a diagram like this:
```mermaid
flowchart LR
Markdown --> ckdocs --> SVG
```
ckdocs supports 23 Mermaid diagram types. Each example below includes
complete, copyable source and the rendered diagram.
Not every Mermaid.js directive is supported. Unsupported
constructs produce diagnostics instead of disappearing silently. A fatal
rendering error leaves the escaped source visible. Reports name the page,
diagram number, and parser line where available. A normal build exits 3
with warnings; check and --strict exit 1.
Each diagram is limited to 64 KiB of source, 1024 lines, and 4 MiB per SVG. A page can contain 128 diagrams; a site can contain 1024 distinct diagrams. SVG text uses the reader's installed fonts. Images are static: JavaScript callbacks and interactive links inside the image are unavailable.
Diagram examples
Choose a diagram to view its source and result.