Flowchart
render_flowchartCreate interactive flowcharts to visualize workflows, system architectures, or decision trees. Supports auto-layout, live status updates, and step-through playback.
Instructions
Render an interactive flowchart or diagram. USE THIS whenever the user wants to visualize a flow or structure: a workflow, data pipeline / ETL, system or software architecture, multi-agent or LLM agent design, decision tree, process map, org chart, or state machine. Nodes are rich cards (6 kinds: agent / tool / decision / data / input / output) with a type chip, name, and up to 3 property rows (e.g. model, tokens, latency); pass icon for a custom glyph. Edges support 5 typed kinds (request / response / async / stream / error) with distinct styles. Dagre auto-layout (DAG); draggable, zoomable, pannable, with a node list, minimap, and step-through playback. Status states (queued / running / done / failed / skipped) animate in place: set pollTool + statusPath for live updates, or pass a steps sequence of {nodeId: status} snapshots for manual playback. Do NOT hand-author x/y coordinates to position nodes - omit them and dagre auto-lays out the graph cleanly. Only pass x/y that were round-tripped back to you from a previous render (a user's saved drag layout), and only as a complete set covering every node; a partial set is ignored to prevent overlaps. This is a full-canvas tool, not a dashboard tile - for multi-chart layouts use render_dashboard.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| edges | Yes | Edges between nodes (form a DAG) | |
| nodes | Yes | Nodes in the flow | |
| steps | No | Optional playback sequence: an ordered array of {nodeId: status} snapshots. The user can step/play through them with the playback control. If omitted, a progressive reveal is derived from the graph topology. | |
| theme | No | Theme preset: boardroom, corporate, sales-floor, golden-treasury, clinical, startup, ops-control, tokyo-midnight, zen-garden, consultant, black-tron, black-elegance, black-matrix, forest-amber, forest-earth, sky-light, sky-ocean, sky-twilight, gray-hf, gray-copilot, office-red | |
| title | Yes | Chart title | |
| effects | No | Override effects: none, subtle, shimmer, neon, energetic | |
| palette | No | Override palette only (mix-and-match) | |
| interval | No | Poll interval in seconds. Default: 2 | |
| pollArgs | No | Arguments to pass to pollTool | |
| pollTool | No | Optional: name of an MCP tool to poll for live status updates (use 'poll_http' with a preset for external APIs) | |
| subtitle | No | Optional subtitle | |
| direction | No | Layout direction. TB (top-bottom, default) or LR (left-right) | |
| statusPath | No | Dot-path to a {nodeId: status} map in the poll result (e.g. 'states' or 'agents.statuses'). If omitted, the result itself is treated as the map. | |
| typography | No | Override typography: professional, luxury, cyberpunk, editorial, mono, bold, system, techno | |
| interactive | No | Allow drag-to-reposition nodes. Default: true |