Blazor Linear Gauge
A linear gauge shows a value on a straight scale, horizontal or vertical, with ticks, ranges, and a pointer - think of a thermometer or a level meter.
Basic Usage link
A horizontal linear gauge with configurable tick placement, pointer type, and value.
Ranges and Value Display link
Colored ranges highlight status zones. Use ShowValue and a <Template> to display a custom label next to the pointer.
Rounded Ranges link
Use BorderRadius on RadzenLinearGaugeScaleRange for pill-shaped bands.
Reversed Scale link
Set Reversed="true" to place Max on the left and Min on the right.
Draggable Pointer link
Set Draggable="true" with @bind-Value. Click anywhere on the scale or drag the pointer to update the value.
Vertical Orientation link
Set Orientation="Orientation.Vertical" for compact dashboard layouts. All pointer types and ranges are supported.
Multiple Scales link
Use LinePosition to stack independent scales inside the same gauge container.
Frequently asked questions
When should I use a linear gauge?
When a straight scale fits your layout better than a dial - a vertical level beside a stat, or a horizontal meter in a row - or when you want several scales side by side.
What can I configure?
The orientation, scale ranges and ticks, one or more pointers (including a draggable one), and a reversed scale.
Radzen Blazor Components, © 2018-2026 Radzen.
Source Code licensed under
MIT