Pixel Agents Standalone

Pixel Agents Standalone

A standalone web app that visualizes your Claude Code sessions as pixel art characters working in a virtual office.

Each Claude Code agent becomes a character that walks around, sits at a desk, and visually reflects what it's doing — writing code, running tools, waiting for permission, or idle.
Based on pixel-agents by Pablo De Lucca (MIT License).
The original is a VS Code extension. This fork runs as a standalone web app in your browser — no VS Code required.

What's Different

Quick Start

Open http://localhost:3456 in your browser. The server watches ~/.claude/projects/ for active Claude Code sessions and shows agents in real time.

Auto-Launch with Claude Code

To start the server automatically when a Claude Code session begins, add a SessionStart hook to ~/.claude/settings.json:

Edit scripts/cmux-hook.sh and set PIXEL_AGENTS_DIR to wherever you cloned this repo.

Development

Runs the Express server (with hot reload) and Vite dev server concurrently.

Architecture

- Server (server/) — Express + WebSocket. Watches JSONL transcripts, parses agent activity, serves the UI.
- Watcher — Monitors ~/.claude/projects/ for active session files using chokidar.
- Parser — Reads JSONL lines to detect tool usage, subagent spawns, permission requests, idle states.
- UI (webview-ui/) — React + Canvas 2D game engine with pathfinding, sprite animation, and an office layout editor.

Office Tileset

The built-in layout uses basic furniture (desks, chairs, plants). For the full 452-piece furniture catalog, purchase the Office Interior Tileset by Donarg ($2 on itch.io), place it at assets/office_tileset_16x16.png, and run:

Support

If watching your agents wander a pixel office made your day better, a ⭐ star keeps the office lights on — and star the…