Gauge
Displays a single metric value within a defined range using radial, arc, or linear visual styles.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <Gauge />
When to Use
- Visualize capacity, utilisation, or performance metrics at a glance.
- Show a single KPI (CPU usage, battery level, score) within a min/max range.
- Use Radial for dashboards, Arc for compact metric cards, Linear for inline progress.
- Apply thresholds to automatically shift colour from green → amber → red as values rise.
25%
60%
90%
30%
65%
95%
40%
70%
90%
CPU
RAM
Disk
30%
30
65%
65%
65%
Switch variant to compare Radial, Arc, and Linear shapes.
Low
Med
High
API Reference
Gauge
Related Components
- Progress — Linear and circular progress bars with indeterminate support.
- RingProgress — A clean determinate progress ring optimised for inline use.
- Statistic — Display a single numeric KPI with label and trend.