A real-time dashboard for monitoring and visualizing Claude Code agent teams — rendered in a retro CRT/phosphor terminal aesthetic.
Features • Demo • Installation • Documentation • Contributing
Real-time agent team visualization with CRT terminal aesthetic
| Feature | Description |
|---|---|
| ⚙️ Approval System | Permission request approval panel, global modal, toast notifications, browser alerts |
| 🛡️ Supervision Rules | Rule-based agent supervision with auto-extraction from feedback |
| 🎓 Onboarding Tour | 5-step interactive guided walkthrough for new users |
| 📊 Matrix View | Dashboard with team overview, agent roster cards, and filterable task registry |
| 🕸️ Graph View | Interactive DAG topology of agents and task dependencies powered by ReactFlow |
| 💬 Comms View | Agent communication log with per-agent filtering and message type badges |
| 📅 Timeline View | Chronological feed of all task status changes with transition history |
| 🔍 Task Detail Panel | Click any task to open a sliding panel with full description, owner, and dependency info |
| 📝 Review Panel | Feedback log, agent preferences management, and statistics with LLM-powered insights |
| 🧠 Memory Management | View and edit team MEMORY.md with AI-powered memory extraction |
| 🔄 Knowledge Transfer | Cross-team knowledge migration with LLM analysis and classification |
| 📋 Context Summary | Three-section context (Decisions/Progress/Context) with token budget |
| 🎯 Exec Summary | AI-generated team progress with caching |
| 📤 Export | Download the topology graph as PNG or the full team state as JSON |
| ⚡ Real-time Sync | WebSocket push updates with automatic polling fallback |
| 🎨 12 Themes | 7 dark + 5 light terminal-inspired themes |
| 🌍 i18n | Full English/Chinese bilingual support |
| 🎭 Demo Mode | Built-in mock team auto-activates when no live teams detected |
- Node.js 18+
- Claude Code (optional — demo mode works standalone)
# Install globally
npm install -g evo-agent-team
# Run the dashboard
evo-agent-teamOr use without installing:
npx evo-agent-teamThen open http://localhost:5173
# Start with default settings
evo-agent-team
# With custom port (server)
PORT=4000 evo-agent-team
# Disable demo mode
DEMO_MODE=off evo-agent-teamCreate .env file in your project root:
# Data directories
TEAMS_DIR=~/.claude/teams
TASKS_DIR=~/.claude/tasks
# Server settings
PORT=3006
POLL_INTERVAL_MS=2000
DEMO_MODE=auto
# LLM configuration (for AI features — supports 20+ providers)
LLM_PROVIDER=openai-compatible
LLM_API_KEY=your-api-key
LLM_BASE_URL=https://api.openai.com/v1
LLM_MODEL=claude-sonnet-4-6| Variable | Default | Description |
|---|---|---|
TEAMS_DIR |
~/.claude/teams |
Claude Code team configs |
TASKS_DIR |
~/.claude/tasks |
Claude Code task files |
PORT |
3006 |
API server port |
DEMO_MODE |
auto |
auto/on/off |
LLM_PROVIDER |
openai-compatible |
Provider: openai, anthropic, google, groq, openai-compatible |
LLM_API_KEY |
- | Required for AI features (summaries, extraction, supervision) |
LLM_BASE_URL |
- | Custom API endpoint (for openai-compatible provider) |
LLM_MODEL |
- | Model identifier |
The dashboard reads from:
| Source | Path |
|---|---|
| Team configs | ~/.claude/teams/{team}/config.json |
| Task files | ~/.claude/tasks/{team}/{task-id}.json |
| Agent inboxes | ~/.claude/teams/{team}/inboxes/{agent}.json |
| Memory | ~/.claude-internal/projects/{cwd}/memory/MEMORY.md |
| Feedback | ~/.claude/teams/{team}/feedback/{agent}.jsonl |
| Supervision rules | ~/.claude/teams/{team}/TEAM_GUIDE.md ## Supervision Rules |
| Layer | Technology |
|---|---|
| Frontend | React 18, TypeScript, Vite, Tailwind CSS v4 |
| State | React Hooks, WebSocket |
| Graph | @xyflow/react (ReactFlow) |
| i18n | react-i18next |
| Backend | Node.js, Express 4, TypeScript ESM |
| Real-time | WebSocket (ws), fs.watch |
| AI | Multi-provider LLM via @mariozechner/pi-ai (OpenAI, Anthropic, Google, Groq) |
agent-team/
├── server/ # Express API (TypeScript ESM)
│ └── src/
│ ├── routes/ # API endpoints
│ ├── index.ts # Server entry
│ └── config.ts # Environment config
├── client/ # React 18 + Vite
│ └── src/
│ ├── components/ # UI components
│ ├── hooks/ # Custom hooks
│ ├── utils/ # Utilities
│ └── i18n.ts # Translations
└── wiki/ # Documentation
├── 01-project-roadmap.md
├── 02-system-architecture.md
└── 90-changelog.md
# Clone repository
git clone <repo-url>
cd agent-team
# Install dependencies
npm install
# Start development
npm run dev
# Build for production
npm run build
# Start production server
npm run start -w server| Script | Description |
|---|---|
npm run dev |
Start client + server in dev mode |
npm run build |
Build client for production |
npm run start -w server |
Start production server |
CRT phosphor terminal aesthetic:
- Phosphor (
#39ff6a) — primary accent - Amber (
#f5a623) — warnings/in-progress - Crimson (
#ff3b5c) — errors/blocked - Ice (
#7eb8f7) — informational - Void (
#040608) — background - Fonts: JetBrains Mono + Syne
Contributions are welcome! Please read our Contributing Guide for details.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
MIT © 2026