Visualize AI agents as pixel art characters in a virtual office. VS Code/Cursor extension.

Agent Arcade

Visualize your Claude Code agents as pixel art characters in a virtual office.

Each Claude Code terminal becomes an animated character that walks around a pixel art office, sits at a desk, and visually reflects what the agent is doing: typing when writing code, reading when searching files, walking when switching tasks.

Built for teams using Claude Code who want a fun, at-a-glance view of what their agents are up to.

Features

• One agent, one character: every active Claude Code session gets its own animated pixel art character
• Live activity tracking: characters animate based on real-time transcript parsing (typing, reading, thinking, idle)
• Sub-agent visualization: when an agent spawns sub-agents via the Task tool, child characters appear linked to their parent with dashed connection lines
• Spawn agents from the office: click "+ Agent" to open a new Claude Code terminal, optionally with a task prompt
• Click to inspect: click any character to see model, branch, task summary, elapsed time, and sub-agent info
• Wave goodbye: when an agent finishes, its character waves, walks to the door, and fades out
• 6 diverse characters: Metro City pixel art sprites with full 4-directional walk, typing, and reading animations
• Dark pixel art aesthetic: sharp corners, hard shadows, monospace fonts: the way pixel art should look

Requirements

• VS Code or Cursor 1.85.0+
• Claude Code CLI installed and configured

Installation

From VSIX (recommended for teams)

# Clone and build
git clone https://github.com/mshadmanrahman/agent-arcade.git
cd agent-arcade
npm install
npm run compile

# Package
npx vsce package --no-dependencies

# Install in VS Code / Cursor
code --install-extension agent-arcade-0.1.0.vsix
# or
cursor --install-extension agent-arcade-0.1.0.vsix

From source (development)

git clone https://github.com/mshadmanrahman/agent