Progress Bar

Preview

About

A linear progress bar. Determinate (with value between 0 and 1) or indeterminate (value null, the fill animates back and forth). Pill-shaped track over a neutral background.

• value: progress 0..1; null = indeterminate.
• size: sm (4px track), md (8px, default), or lg (12px).
• variant: primary (default), neutral, success, warning, or danger.
• color / trackColor: override the fill and track color directly, ignoring variant.
• label / valueLabel: optional text above the track (left/right, e.g. "Storage" / "60%").

No card chrome of its own — compose it inside a KasyCard, same as NumberValue.

Last updated on 08/23/2026