Mermaid-diagram
Källan skrivs i Mermaid och ritas till SVG på servern av pele. Färger och typsnitt kommer från bibliotekets tokens, så diagrammet följer mörkt läge utan att ritas om. Ett brett diagram behåller sin storlek och rullar i sidled.
Flöde
Steg och beslut, i läsriktningen.
<Diagram label="Från kod till drift" source={källa} />Datamodell
Tabeller, kolumner och hur de hänger ihop.
<Diagram label="Kvarts datamodell" caption="Varje sajt hör till ett projekt, varje projekt till en kund." source={källa} />Sekvens
Vem som frågar vem, i tidsordning.
<Diagram label="En besökare når en skyddad sajt" source={källa} />Fel i källan
En källa som inte går att läsa visas som den är, med orsaken, i stället för ett tomt fält.
Diagrammet gick inte att rita: Parse error on line 2: a --> -------^ Expecting 'NODE_STRING', got 'EOF'
flowchart LR
a --> <Diagram label="Trasigt" source={"flowchart LR\n a --> "} />