ConTeX ✦

25 context-window meters for the Claude Code statusline. Clone, pick a bar, vibe. macOS and Windows.

Your context window is the fuel gauge of a Claude Code session — this repo replaces the boring readout with a bar you actually want to look at: a comet burning across the line, a constellation going dark star by star, a Zelda heart meter, digital rain, a fuse running out.

(Rendered by the actual design code — regenerate with node scripts/generate-preview.js. Every design also has a separate light-terminal palette.)

Install

git clone https://github.com/JustinGamer191/ConTeX.git
cd ConTeX
node install.js

The picker previews every bar live in your terminal, in real color, on your actual background — at 35% and 85% used — then you pick a number. It wires the statusline into ~/.claude/settings.json (backing up whatever statusline you had, restorable later) and stores your choice in ~/.claude/context-bar.json.

Switch designs anytime by running node install.js again. No restart needed — the statusline picks up the change on its next render.

Requires Node 18+ and Claude Code. No dependencies.

The bars

Every design goes red (its own way) at 80%+ used — the danger zone before autocompact.

What the line shows

<model> │ <current task, when one is in progress> │ <directory> <bar> <pct>

• The percentage is used context, scaled to the usable window (Claude Code reserves ~16.5% for autocompact; CLAUDE_CODE_AUTO_COMPACT_WINDOW is respected). It stays dim until 50%, warms, then goes bold red at 80%.
• What the bar measures is the context window by default. Set "source": "five_hour" or "seven_day" in ~/.claude/context-bar.json to show your plan's rate-limit usage instead — the 5-hour or 7-day window Claude Code reports in the statusline payload. On Claude Code versions that don't send rate_limits, the bar falls back to context.
• Light/dark is auto-detected from the OS appearance — macOS system appearance or the Windows AppsUseLightTheme registry key (cached, checked every 20s) — so the palette follows your system's day/night switching. Override with CONTEXT_BAR_THEME=light|dark or "theme": "light" in ~/.claude/context-bar.json. Other platforms default to dark.

Platform support

Windows notes: use a VT-capable terminal (Windows Terminal — which Claude Code effectively requires anyway). A few designs lean on font fallback for their glyphs (Runes ᚠᚢᚦ, Matrix katakana, Pac-Man ᗧ) — the picker previews everything up front, so if a glyph looks wrong in your font, pick a different bar.

Uninstall

node install.js --uninstall

Restores whatever statusline you had before, removes the config, and then the cloned folder is yours to delete.

Contributing a design

A design is one small file in designs/:

'use strict';
const { c } = require('../lib/ansi');

module.exports = {
  name: 'my-bar',          // kebab-case, unique
  title: 'My Bar',
  blurb: 'One line for the picker.',
  render(used, { light }) {
    // used: 0–100 (% of usable context consumed)
    // light: true when the terminal background is light
    // return JUST the bar as an ANSI string — the core adds everything else
    return c(light ? 28 : 46, '█'.repeat(Math.round(used / 10)));
  },
};

Register it in designs/index.js, run node test.js (every design must render 0–100 in both themes without throwing), and open a PR. House rules:

• 256-color ANSI only (38;5;n) — truecolor support varies too much
• Design both palettes. Bright pale colors vanish on light backgrounds; deep saturated colors read as "hot" there instead
• Have a danger state at 80%+ used
• Keep it under ~16 characters wide so the line survives narrow terminals

License

MIT