ClaudeUI — Real-time dashboard for Claude Code

Everything you need to see inside Claude Code

████░░ 42%

Statusline

Real-time status bar showing context usage, cost, cache ratio, turn count, git diff, tool trace, and matrix rain animation. Two modes: full (3-line) and compact (1-line).

>_ monitor

Live Monitor

Dashboard in a separate terminal with live stats, scrollable log viewer with filters, session browser, and export. Auto-detects active sessions.

$0.00 → $∞

Session Stats

Post-session analytics with cost breakdown, token usage sparkline, tool usage chart, file activity heatmap, and multi-session summaries.

ls sessions/*

Session Manager

Browse, search, compare, resume, and export Claude Code sessions. Diff two sessions side-by-side to compare cost, duration, and activity.

on:edit → run

Hooks

Automatic context injected into sessions — file activity heatmap on start, reverse dependency warnings after edits, high churn alerts before edits.

/ui:*

Slash Commands

In-session analytics on demand: /ui:session /ui:cost /ui:perf /ui:context for deep reports without leaving Claude Code.

Statusline

Real-time status bar with everything you need at a glance

Full mode (3-line):
 Opus 4.6 │ ████████████████░░░░ 78% 155.2k/200.0k │ ~8 turns left │ $12.47 │ 2h 10m │ 1x compact
 my-app │ feature/auth +120 -45 │ 56 turns │ 12 files │ 78% cache
 read auth.ts → edit auth.ts → bash npm test │ auth.ts×2
Compact mode (1-line):
 Opus 4.6 │ ████████████████░░░░ 78% 155.2k/200.0k │ $12.47 │ 2h 10m │ 56 turns │ 1xcompact

Context progress bar with color thresholds
Context usage sparkline with compaction markers
Compaction prediction (turns remaining)
Session cost and cost-per-turn
Cache hit ratio
Git branch and diff stats
Live tool trace with file edit counts
Matrix rain animation (context-aware)
Pluggable widgets: matrix, hex, bars, progress
Thinking block count
Sub-agent count
Session duration and ID

Live Monitor

Full-screen dashboard in a separate terminal — run claude-ui-monitor

claude-ui-monitor

10101111010111101011110101111010111101011110101111010111101011110101111010111101
────────────────────────────────────────────────────────────────────────────────
  ○ claude-opus-4-6  │  #a1b2c3d4  │  2h 15m 30s  │  ACTIVE
  CONTEXT
  ████████████████░░░░░░░░░░░░░░░░░░░░░░░░  40.2%  80.3k/200.0k
  ▃▃▄▅▅▆▇▇▇↓↓▄▄▄▅▅▅▆▇▇↓▃▃▃▄▄▄▄▅▆▆▇▇↓▃▄▄▅▆▆▇▇▇↓▃▃▄▄▄▅▅▅▅▆▆▆▇▇▇↓
  Compactions: 6  │  Turns left: ~5  │  Since compact: 4
  COST
  $248.46 total  │  ~$1.10/turn  │  $0.15/min  │  $2013.62 saved
  Input: $0.03  │  Cache: $223.74  │  Output: $24.69
  ██████████████████████████████████████████████████
  ■input 0%  ■cache 100%  ■output 0%
  CURRENT
  3 tools  │  Bash:2  Write:1
  bash ls → bash mkdir → write index.html │ index.html×1
  index.html(0r/1e)
  0 errors  │  1 thinking
  SESSION
  226 turns  │  833 tools  │  Edit:278  Read:218  Bash:197
  monitor.py(120r/102e) statusline.py(87r/79e) README.md(45r/84e)
  15 errors  │  59 thinking (4%)  │  99% cache  │  3 agents
  LOG
  14:22:10  grep CLAUDE.md
  14:22:45  $ git diff --cached --stat
  14:23:01  $ git add README.md install.sh && git commit
  14:23:15  $ git push
  14:30:22  ⚡ compaction #6
  14:31:50  $ ls docs/ && mkdir -p docs
  14:33:12  write index.html
  ────────────────────────────────────────────────────────────────────────────────
  [s] stats  [d] details  [l] log  [e] export  [o] sessions  [?] help  [q] quit

Auto-detects active session
Live refresh on transcript changes
Matrix rain header (active/idle aware)
Context sparkline with compaction markers
Cost breakdown with cache savings
Per-turn tool trace and file edit counts
Session-wide stats and file heatmap
Scrollable log viewer with word wrapping
Filter log: all, errors, bash, edits, search, compactions
Live auto-scroll follows new entries
Vim-style navigation (Ctrl+F/B, g/G)
Export session data to markdown

Session Stats

Post-session analytics and multi-session summaries

$ claude-stats
$ claude-stats --days 7 -s
  Session Summary (6 sessions)
  ──────────────────────────────────────────────────────────────────
  ID       Date         Duration     Cost  Turns  Compact Model
  ──────────────────────────────────────────────────────────────────
  a1b2c3d4 2026-03-08        45m $  2.31     34        0 opus 4 6
  e5f6a7b8 2026-03-07     2h 10m $ 12.47    156        1 sonnet 4 6
  c9d0e1f2 2026-03-04        18m $  0.52     12        0 opus 4 6
  ──────────────────────────────────────────────────────────────────
  Total                  13h 20m $ 97.79

Hooks

Automatic context injected into your sessions

Session start — file activity heatmap:
📊 File hotspots (last 14 days, 8 sessions):
  ███ src/config.ts (43e/12r)
  ▆▆▆ src/pages/dashboard/index.vue (39e/8r)
  ▅▅▅ src/locales/en.json (21e/15r)
After editing — reverse dependency check:
⚠️ 4 file(s) depend on validation.ts:
  → app/composables/useAuth.ts
  → app/composables/useNotifications.ts
Before editing — high churn warning:
🔥 High churn: config.ts edited 43 times across 5 sessions

Quick Start

Step 1

Install

# One command installs everything
curl -sSL https://raw.githubusercontent.com/slima4/claudeui/main/install.sh | bash

Step 2

Use Claude Code

# Statusline and hooks work automatically
claude

# Open a second terminal for live monitor
claude-ui-monitor

Step 3

Explore

# Inside Claude Code
/ui:session
/ui:cost

# After a session
claude-stats
claude-sessions list