Glances — TUI Brandbook

01 Foundations

Voice

Keyboard-first — every action has a binding.
Dense information, zero chrome waste.
Status at a glance — color encodes state.

Avoid

Mouse-only workflows
Decorative UI that steals columns
Ambiguous state without color cues

Design principles

Monospace grid — align to character cells, not pixels.
ANSI palette is the design system — reuse semantic colors consistently.
Box-drawing borders define panes; never float widgets.
Key hints belong in a persistent footer or status line.

An Eye on your system.…

Glances-style CLI toolsKeyboard-driven dashboards

02 ANSI palette

Scheme: glances default curses UI

Chrome

bg #000000

fg #00ff00

cursor #00ff00

selection #003300

accent #00ff00

ANSI 16

black #484f58

red #ff0000

green #00ff00

yellow #ffff00

blue #58a6ff

magenta #bc8cff

cyan #39c5cf

white #c9d1d9

bright_black #6e7681

bright_red #ffa198

bright_green #56d364

bright_yellow #e3b341

bright_blue #79c0ff

bright_magenta #d2a8ff

bright_cyan #56d4dd

bright_white #ffffff

03 Typography

Mono — JetBrains Mono

$ # launch glances
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz
0123456789  !@#$%^&*()  []{}  │─┌┐└┘├┤┬┴┼  ▸▸▼▶

│─┌┐└┘├┤┬┴┼═║╔╗╚╝╠╣╦╩╬ ▁▂▃▄▅▆▇█

04 TUI widgets

Status bar · panes · list · table · gauges · sparkline · modal · key hints

Glances │ context: default │ CPU 12% │ MEM 34% │ ? help

┌─ repository ─────────────────────┐
│ ▼ src/                           │
│   ├─ main.rs                     │
│   └─ lib.rs                      │
│ ▶ tests/                         │
└──────────────────────────────────┘

┌─ files ──────────────────────────┐
│ ▸ README.md          modified    │
│   Cargo.toml         unchanged   │
│   LICENSE            unchanged   │
└──────────────────────────────────┘

┌──────┬──────────┬────────┬───────┐
│ PID  │ NAME     │ CPU%   │ MEM%  │
├──────┼──────────┼────────┼───────┤
│ 1842 │ worker   │  12.4  │  8.1  │
│ 2091 │ api      │   4.2  │ 14.3  │
└──────┴──────────┴────────┴───────┘

CPU [████████████░░░░░░░░] 62% NET ▁▂▃▅▆▇█▇▆▅▄▃▂▁▂▃▄▅ 1.2 Gbps DISK [██████░░░░] 58% ERR 0

╭─ command palette ────────────────╮
│ > checkout main                  │
│   stash pop                      │
│   fetch --all                    │
╰──────────────────────────────────╯

j/k navigate │ enter select │ / filter │ q quit │ ? help

05 Usage

Do

Use #00ff00 for selection and primary focus states.
Reserve bright red/green for destructive/success git or status states.
Keep status bar one line; overflow truncates with ellipsis.

Don't

Don't use proportional fonts inside panes.
Don't rely on color alone — pair with icons or glyphs.
Don't break the 80-column grid without explicit wide mode.

06 Accessibility

Pair	Ratio	WCAG
fg on bg	15.3	AAA
accent on bg	15.3	AAA
green on bg	15.3	AAA
red on bg	5.25	AA