agent-canvas

Agent Canvas is a specialized tool for AI coding agents that allows for persistent, visual workspace management. By integrating a command-line interface with a TLDraw-powered whiteboard, agents can create dynamic visual documentation, architecture diagrams, and sequence flowcharts to explain complex system logic. This skill enables agents to communicate ideas more effectively to human developers, effectively turning the canvas into a collaborative whiteboard for pair programming, debugging, and system design sessions.

Designed for developers, architects, and engineering teams, this tool excels in managing complex workflows where visual clarity is paramount. Whether you are mapping out microservice dependencies, explaining a bug fix, or reviewing pull requests with logical diff chunks, Agent Canvas provides a structured environment to keep visual evidence and code changes in context.

• Full lifecycle canvas control: Create, manage, and manipulate shapes, arrows, and complex containers programmatically.

• Specialized shape support: Utilizes a diverse palette of shapes including geo primitives, markdown for long-form narrative, code-diff comparisons, stack-trace displays, and file-tree visualizations.

• Interactive prototyping: Supports embedded HTML shapes for sandboxed UI demos, data visualization, and live web previews.

• Multi-agent orchestration: Allows multiple agents or separate workflows to operate on the same canvas, facilitating swarm-like collaboration and isolated git worktree tracking.

• Automated evidence gathering: Automatically handles logs, test results, and command transcripts via specialized terminal and test-result shapes, reducing manual documentation effort.

• Use the specific shape types (such as ai-terminal or code-diff) instead of generic text or markdown whenever possible to maintain semantic clarity and visual consistency.

• Ensure the board is open in a browser tab during operation, as the system relies on a WebSocket relay between the CLI and the TLDraw editor.

• Use the headless mode for automated CI/CD pipelines or background agent tasks that do not require active manual monitoring.

• Leverage the provided CLI commands to list, create, and rename boards for organized project structure across multiple repositories.

• Always keep the canvas synchronized with your current working branch; utilize the tool to visualize changes before and after implementation to accelerate review cycles and improve understanding of the codebase.