Diagrams are standard Mermaid —
anything Mermaid renders works here unchanged. Graph Giraffe adds a few extras:
1 · Hyperlinks in labels (Graph Giraffe extension)
Write a markdown-style link inside any node or edge label. The URL must start with http(s)://. Links open in a new tab.
flowchart LR
A["Read the [Mermaid docs](https://mermaid.js.org)"]
A -->|"[why?](https://example.com)"| B[Plain node]
Tip: quote the label (A["…"]) when it contains a link.
2 · Native Mermaid click links (also supported)
flowchart LR
A[Whole node is a link]
click A "https://mermaid.js.org" "tooltip text"
3 · Collapsible blocks
In flowcharts, click a subgraph to fold it into one block (edges reroute automatically); click the folded block to expand.
While anything is collapsed, style/classDef/click lines are temporarily ignored — they return on expand.
Your source is never modified.
4 · Share links
🔗 Share encodes the whole diagram + theme into the URL — anyone opening it sees exactly what you see.