Interactive token-usage dashboard for Claude Code.
Run npx graphtrack, open localhost:9090, and see exactly where your tokens go —
as a graph, a table, or a multi-session overview.
Your logs never leave your machine.
# No install needed — runs directly from npm
npx graphtrack
# Or install globally
npm install -g graphtrack
graphtrackRequires Node.js 18+.
npx graphtrack
# → Server starts at http://localhost:9090Point at a custom log directory:
npx graphtrack --dir /path/to/.claude/projectsUse a different port:
npx graphtrack --port 3000| View | What it shows |
|---|---|
| Overview | Aggregate stats across all sessions — total tokens, per-project breakdown, tool usage share |
| Aggregate Graph | Hub-and-spoke network: each tool is a node, size = token share, color = tool type |
| Chronological Graph | Turn-by-turn chain: each prompt links to the tools it triggered, ordered in time |
| Table | Sortable per-tool and per-turn tables with color-coded token bars |
A searchable dropdown groups sessions by project — type to filter by ID or project name, then click to load.
- Input / output / cache tokens per session, per turn, and per tool call
- Real timestamps — session start time and wall-clock duration from the actual logs
- Tool breakdown — which tools consume the most tokens, how many times each was called
- Project grouping — sessions organized by project in the Overview view
| Tool | Color |
|---|---|
| Edit | ● Red |
| Bash | ● Yellow |
| Read | ● Blue |
| Write | ● Green |
| Glob | ● Purple |
| Grep | ● Pink |
| Agent | ● Orange |
src/
types.ts Data model (Session, Turn, ToolCall, Usage, Overview)
parser.ts JSONL → Session + aggregateSessions()
graph.ts Session → vis.js nodes/edges (aggregate + chronological)
server.ts Express API + static file serving
cli.ts CLI entry point (--dir, --port, --help)
public/
index.html Dashboard UI (4 views, vanilla JS)
images/ Icon and assets
test/
parser.test.ts Unit tests for parser, aggregation, and graph builders
fixtures/ Sample session data for tests
MIT