feedback

meter

A proportion bar — single value with a tone, or segmented spans with an optional playhead. The thermal tone system drives color: success, warning, destructive, primary.

Three fixed tones at a glance, plus a slider-driven value in primary. Drag to see the bar respond.

Installation

Usage

Use when

  • Single value — a ratio or fill level (health, progress, capacity)
  • Segmented — a timeline or span breakdown with segment colors and a moving playhead

Not for

  • Categorical status (not a proportion) — use status-dot
  • Relative frequency across items — use frequency-bar

Three segments (Intro / Build / Drop) with a playhead sweeping across on a timer.

IntroBuildDrop

Three segments (Intro / Build / Drop) with a playhead sweeping across on a timer.

Used in

Service Health Panel