Skip to main content
Claude HUD has two layout modes — expanded (the default) and compact — plus an optional separator that can be added to either. You switch between them via /claude-hud:configure or by editing config.json directly.

​
Layout modes

Expanded mode renders each element on its own line. Context and usage are joined on a single line when they are adjacent in the element order.
[Opus | Max] │ my-project git:(main*)
Context █████░░░░░ 45% │ Usage ██░░░░░░░░ 25% (1h 30m / 5h)
◐ Edit: auth.ts | ✓ Read ×3
◐ explore [haiku]: Finding auth code (2m 15s)
▸ Fix authentication bug (2/5)
Lines 1 and 2 are always shown. The tools, agents, and todos lines only appear when showTools, showAgents, and showTodos are enabled and there is activity to display.Config:
{
  "lineLayout": "expanded",
  "showSeparators": false
}

​
Switching layouts

The easiest way to switch is through the interactive configure command: 
/claude-hud:configure
To change it manually, edit ~/.claude/plugins/claude-hud/config.json: 
{
  "lineLayout": "expanded"
}
Valid values for lineLayout are "expanded" and "compact". Invalid values fall back to "expanded".

​
Controlling element order (expanded mode)

In expanded mode, elementOrder determines both the order and visibility of elements. Any element omitted from the array is hidden. Default order: 
{
  "elementOrder": ["project", "context", "usage", "environment", "tools", "agents", "todos"]
}
ElementWhat it renders
projectModel name, project path, git branch
contextContext window bar and percentage
usageRate limit bars (Pro/Max/Team only)
environmentCLAUDE.md count, rules, MCPs, hooks
toolsActive and recently completed tools
agentsRunning subagents
todosTodo list progress
When context and usage are adjacent in the array, they are rendered on the same line joined by │. If you separate them, each gets its own line.

​
Example: moving tools before context

To show tool activity before the context bar: 
{
  "elementOrder": ["project", "tools", "context", "usage", "environment", "agents", "todos"]
}
Output: 
[Opus | Max] │ my-project git:(main*)
◐ Edit: auth.ts | ✓ Bash: npm run build
Context █████░░░░░ 45% │ Usage ██░░░░░░░░ 25% (1h 30m / 5h)
2 CLAUDE.md | 4 rules | 3 MCPs

​
Example: hiding environment counts

Omit environment from the array to remove it entirely: 
{
  "elementOrder": ["project", "context", "usage", "tools", "agents", "todos"]
}
You can also use display.showConfigCounts: false to hide the environment line without changing elementOrder.

​
Config reference

OptionTypeDefaultDescription
lineLayout"expanded" | "compact""expanded"Layout mode
showSeparatorsbooleanfalseInsert a separator rule before activity lines
elementOrderstring[]["project","context","usage","environment","tools","agents","todos"]Expanded-mode element order. Omit entries to hide them.

Build docs developers (and LLMs) love

Get started for freeTalk to us