A VS Code extension that turns your AI coding agents into animated pixel art characters in a virtual office. Each Claude Code terminal you open spawns a character that walks around, sits at desks, and visually reflects what the agent is doing — typing when writing code, reading when searching files, waiting when it needs your attention. This is the source code for the free Pixel Agents extension f
Add this skill
npx mdskills install pablodelucca/pixel-agentsWell-documented VS Code extension visualizing Claude Code agents as animated pixel art characters
A VS Code extension that turns your AI coding agents into animated pixel art characters in a virtual office.
Each Claude Code terminal you open spawns a character that walks around, sits at desks, and visually reflects what the agent is doing — typing when writing code, reading when searching files, waiting when it needs your attention.
This is the source code for the free Pixel Agents extension for VS Code — you can install it directly from the marketplace with the full furniture catalog included.
![]()
One agent, one character — every Claude Code terminal gets its own animated character
Live activity tracking — characters animate based on what the agent is actually doing (writing, reading, running commands)
Office layout editor — design your office with floors, walls, and furniture using a built-in editor
Speech bubbles — visual indicators when an agent is waiting for input or needs permission
Sound notifications — optional chime when an agent finishes its turn
Sub-agent visualization — Task tool sub-agents spawn as separate characters linked to their parent
Persistent layouts — your office design is saved and shared across VS Code windows
Diverse characters — 6 diverse characters.
![]()
If you just want to use Pixel Agents, the easiest way is to download the VS Code extension. If you want to play with the code, develop, or contribute, then:
git clone https://github.com/pablodelucca/pixel-agents.git
cd pixel-agents
npm install
cd webview-ui && npm install && cd ..
npm run build
Then press F5 in VS Code to launch the Extension Development Host.
The built-in editor lets you design your office:
The grid is expandable up to 64×64 tiles. Click the ghost border outside the current grid to grow it.
The office tileset used in this project and available via the extension is Office Interior Tileset (16x16) by Donarg, available on itch.io for $2 USD.
This is the only part of the project that is not freely available. The tileset is not included in this repository due to its license. To use Pixel Agents locally with the full set of office furniture and decorations, purchase the tileset and run the asset import pipeline:
npm run import-tileset
Fair warning: the import pipeline is not exactly straightforward — the out-of-the-box tileset assets aren't the easiest to work with, and while I've done my best to make the process as smooth as possible, it may require some manual tweaking. If you have experience creating pixel art office assets and would like to contribute freely usable tilesets for the community, that would be hugely appreciated.
The extension will still work without the tileset — you'll get the default characters and basic layout, but the full furniture catalog requires the imported assets.
Pixel Agents watches Claude Code's JSONL transcript files to track what each agent is doing. When an agent uses a tool (like writing a file or running a command), the extension detects it and updates the character's animation accordingly. No modifications to Claude Code are needed — it's purely observational.
The webview runs a lightweight game loop with canvas rendering, BFS pathfinding, and a character state machine (idle → walk → type/read). Everything is pixel-perfect at integer zoom levels.
There are several areas where contributions would be very welcome:
If any of these interest you, feel free to open an issue or submit a PR.
See CONTRIBUTORS.md for instructions on how to contribute to this project.
Please read our Code of Conduct before participating.
If you find Pixel Agents useful, consider supporting its development:
This project is licensed under the MIT License.
Install via CLI
npx mdskills install pablodelucca/pixel-agentsPixel Agents is a free, open-source AI agent skill. A VS Code extension that turns your AI coding agents into animated pixel art characters in a virtual office. Each Claude Code terminal you open spawns a character that walks around, sits at desks, and visually reflects what the agent is doing — typing when writing code, reading when searching files, waiting when it needs your attention. This is the source code for the free Pixel Agents extension f
Install Pixel Agents with a single command:
npx mdskills install pablodelucca/pixel-agentsThis downloads the skill files into your project and your AI agent picks them up automatically.
Pixel Agents works with Claude Code, Claude Desktop, Cursor, Vscode Copilot, Windsurf, Continue Dev, Codex, Gemini Cli, Amp, Roo Code, Goose, Opencode, Trae, Qodo, Command Code. Skills use the open SKILL.md format which is compatible with any AI coding agent that reads markdown instructions.