Help us improve
Share bugs, ideas, or general feedback.
From quorum
Generates Mermaid flowcharts with directions (TD/LR/BT/RL), node shapes, edges (arrows/lines), subgraphs, chaining, styling, FontAwesome icons, interactions, Markdown labels, and config options.
npx claudepluginhub berrzebb/quorum --plugin quorumHow this agent operates — its isolation, permissions, and tool access model
Agent reference
quorum:agents/knowledge/references/mermaid/flowchartThe summary Claude sees when deciding whether to delegate to this agent
``` flowchart TD %% Top-Down (same as TB) flowchart LR %% Left-Right flowchart BT %% Bottom-Top flowchart RL %% Right-Left ``` ``` A[Rectangle] A(Rounded) A([Stadium]) A[[Subroutine]] A[(Cylinder/DB)] A((Circle)) A>Asymmetric] A{Diamond} A{{Hexagon}} A[/Parallelogram/] A[\Parallelogram\] A[/Trapezoid\] A[\Trapezoid/] A((...Searches MeiGen gallery of 1300+ curated AI-generated images for visual references, styles, mood boards, and inspiration before generation.
Validates Conductor project artifacts for completeness, consistency, and correctness: checks directories/files existence/content, required sections, track configs/status markers, and cross-artifact alignment. Delegate after setup, for diagnostics, or pre-implementation.
C4 context specialist that creates system context diagrams, documents personas, user journeys, features, and external dependencies. Synthesizes container/component docs into high-level architecture.
Share bugs, ideas, or general feedback.
flowchart TD %% Top-Down (same as TB)
flowchart LR %% Left-Right
flowchart BT %% Bottom-Top
flowchart RL %% Right-Left
A[Rectangle] A(Rounded) A([Stadium])
A[[Subroutine]] A[(Cylinder/DB)] A((Circle))
A>Asymmetric] A{Diamond} A{{Hexagon}}
A[/Parallelogram/] A[\Parallelogram\] A[/Trapezoid\]
A[\Trapezoid/] A(((Double Circle)))
A@{ shape: cloud } A@{ shape: doc } A@{ shape: docs }
A@{ shape: bolt } A@{ shape: delay } A@{ shape: flag }
A@{ shape: fork } A@{ shape: hourglass }
A@{ icon: "fa:fa-gear", form: "circle", label: "Settings", pos: "t", h: 48 }
A@{ img: "https://example.com/icon.png", label: "Node", pos: "b", w: 60, h: 60 }
A --> B %% Arrow
A --- B %% Line (no arrow)
A -.-> B %% Dotted arrow
A ==> B %% Thick arrow
A ~~~ B %% Invisible link
A --o B %% Circle edge
A --x B %% Cross edge
A <--> B %% Bidirectional
A --> |text| B %% Labeled arrow
A -- "text" --- B %% Labeled line
B ----> E %% Extra dashes = longer span
e1@-->{ animate: true }
e1@-->{ animation: "fast" }
e1@-->{ curve: "stepBefore" }
Curves: basis, bumpX, bumpY, cardinal, catmullRom, linear, monotoneX, monotoneY, natural, step, stepAfter, stepBefore
A --> B --> C
A & B --> C & D %% Multiple connections
flowchart TD
subgraph Backend["Backend Services"]
direction LR
api[API Server] --> db[(PostgreSQL)]
end
subgraph Frontend
app[React App]
end
app --> api
A["`**bold** and *italic*`"]
classDef green fill:#2d6,stroke:#1a4,color:#fff
A:::green --> B
style B fill:#f9f,stroke:#333,stroke-width:4px
linkStyle 0 stroke:#ff3,stroke-width:4px
classDef default fill:#f9f,stroke:#333 %% default class
B["fa:fa-twitter for a]
click A href "https://example.com" _blank
click B call callback() "Tooltip"
Requires securityLevel: 'loose'.
%% This is a comment
---
config:
flowchart:
curve: stepBefore
defaultRenderer: elk
---