Skip to content
Stand with Ukraine flag

Mini gauge

  • Widget
  • v1.0.0
  • Sep 1, 2026
  • MIT license
  • v4.2+ | Built-in
Mini gauge

Preconfigured gauge to display any value reading as a circle. Allows to configure value range, gradient colors, and other settings.

Widget Type
  • Latest
Category
  • Gauges & Indicators
Use Cases
  • Smart Building
  • Industrial Automation

Who it’s for

Dashboard builders who want a ranged reading to sit as a small, soft indicator rather than as an instrument — a status dot with a scale behind it, repeated across a dense board where each tile is glanced at rather than studied.

What it does

The Mini gauge draws a reading as a rounded ring between a minimum and a maximum, with the value in the middle. The rounded cap is what distinguishes it from the other small gauges: the fill ends in a soft curve rather than a hard edge, which reads as an indicator rather than as a measuring instrument.

  • Sized and styled for density — a 2×2 tile meant to appear many times on one board.
  • The rounded cap softens the gauge visually, which suits dashboards where the gauges are context rather than the subject.
  • Position within a range stays readable even at this size, with the value in the center.
  • The ring color can follow the value through a set of levels, so an outlier tile stands out in a grid.
  • Units are converted, not just appended — the gauge respects the unit set on the key and converts to the unit chosen on the widget.
  • The Mini gauge shows one current reading: it has no track behind the fill by default, so it shows position more than it shows remaining headroom.

How to set up

Data keys

The Mini gauge takes one datasource, one entity and one data key.

KeyRoleTypeDescription
Any numeric keyThe value the ring fills toTimeseriesNumeric only. An attribute works equally well. The key’s own units and decimals override the widget-level ones.

Range

SettingDefaultEffect
Min value0The ring’s empty end
Max value100The ring’s full end; must be greater than the minimum
Min and max labelOnPrints both end points
Rounded line capOnRounds the end of the fill, which is what gives this preset its look

How to customize

  • To make the fill change color as the value rises — set the Bar color levels.
  • To show remaining headroom — set a Gauge bar background, which draws the unfilled part of the ring instead of leaving it blank.
  • To sharpen the look — turn off Rounded line cap, which turns this preset into a plain simple gauge.
  • To change the gauge’s shape — set Type to Arc, Donut, Horizontal bar or Vertical bar.
  • To recover space in a small tile — turn off Min and max label.
  • To make the ring heavier or lighter — adjust Relative bar width.
  • To rotate the ring’s opening — set Angle to start from.

Tips

  • Add a gauge bar background when the tile is used to judge headroom rather than position. Without a track, a ring at 30% and a ring at 80% both look like an arc of color, and only the number distinguishes them.
  • Keep captions off these tiles and put the naming in the widget title. At 2×2 the caption competes with the value, and a grid of mini gauges is read by position and color long before anything is read as text.

Share Your Widget with the Community

Built a custom widget? Export it as a JSON from ThingsBoard and publish it to the IoT Hub through a simple 4-step wizard (Upload, Listing, Readme, Review & Submit). Share it with thousands of ThingsBoard developers worldwide and get featured in the catalog.