Skip to content

Cookie preferences

We use cookies for our own analytics, to see how our campaigns perform and, if you allow it, to load content from other services such as the Google site search. We never sell your data. Necessary cookies keep the site working and cannot be switched off. See our Cookie Policy for details and our Privacy Policy for how we handle personal data.

Security, load balancing and remembering your cookie choice.

Show us which pages people read, how they find the site and where they get stuck, so we can improve it (Google Analytics, Microsoft Clarity).

Show us which of our ad campaigns bring visitors to the site and remember the campaign or partner link you arrived from (Google Ads, LinkedIn, Meta, partner program). We do not use these cookies to build advertising profiles.

Load the site search from Google when you use it. Google sets its own cookies and shows ads in the search results.

© 2026 The ThingsBoard Authors

ThingsBoard Cloud

Choose your data region

Your data stays in the region you choose, for residency and compliance. No credit card required.

Rather run it yourself? Install on your own servers

Tank level monitoring

  • Widget
  • 21 installs
  • v1.0.0
  • Nov 10, 2026
  • MIT license
  • v4.3+

Animated tank level with shape-accurate fill geometry, threshold set points. Supports a single-tank detail card or a multi-tank overview grid.

Widget Type
  • Latest
Category
  • Cards & Info
  • Gauges & Indicators
Use Cases
  • Tank Level Monitoring

Who it’s for

Operators and site managers who monitor liquid or bulk storage, such as fuel, water, chemicals or grain, and need to know at a glance how full each tank is and whether any tank has crossed a low or high set point.

What it does

The widget draws each tank in its real shape and fills it according to the latest level reading. The fill height comes from the tank geometry, not from a straight line, so a half-full horizontal cylinder or sphere looks exactly as it does in the field. Each card shows the tank name, the current value, percent full, total capacity and the time of the last update. A status badge and the liquid colour change when a set point trips.

  • One entity shows a single tank card; several entities switch the widget to a grid automatically
  • Text scales with the card size, and is placed beside or below the tank, whichever leaves the tank larger
  • 13 tank shapes: rectangular, vertical cylinder, vertical capsule, vertical with dished ends, vertical oval, sphere, cone, frustum, horizontal cylinder, horizontal capsule, horizontal ellipse, horizontal with 2:1 elliptical ends and horizontal with dish ends. An “Unknown” shape draws the fill linearly against a configured capacity.
  • The level can arrive as volume, percent or liquid height. Values are converted between units automatically.
  • Any number of set points, each with its own severity, direction (falls below / rises above), basis (percent, volume or height), deadband and hold time
  • Optional threshold markers and scale ticks on the tank outline
  • Tank shape, dimensions and set points can be constants or read per entity from attributes
  • Grid sorting by name, level or status severity, and a limit on the number of tanks shown
  • Smooth level animation, which can be switched off or limited to a number of tanks
  • “On tank click” action, for example to open a tank details dashboard state
  • Limitation: the widget takes one datasource. To show several tanks, use an entity alias that resolves to multiple entities.

How to set up

Data keys

KeyRoleTypeDescription
Level key, e.g. levelCurrent levelTimeseriesThe reading from the level sensor. Its meaning is set by Sensor reports: Volume (in Source units, e.g. L or m3), Percent (0-100 % of total volume) or Height (liquid height above the tank bottom, e.g. m). The first timeseries key on the datasource is used as the level.
Shape key, e.g. tankShapeTank shape per entity (optional)AttributeUsed only when Shape from is set to Attribute. Values: rectangle, verticalCylinder, verticalCapsule, verticalDished, verticalOvalPrism, sphere, cone, frustum, horizontalCylinder, horizontalCapsule, horizontalEllipse, horizontalElliptical2To1, horizontalDishEnds, unknown. Any other value falls back to the shape picked under Value.
Dimension keys, e.g. diameter, heightTank dimensions per entity (optional)AttributeUsed when a dimension’s source is set to Attribute. Positive numbers in Dimension units.
Set point keys, e.g. lowLevelSet point value per entity (optional)AttributeUsed when a set point’s source is set to Attribute. Interpreted in the set point’s Measured in basis.

Add every attribute key that a setting refers to the same datasource as the level key, otherwise the widget cannot read it.

Required dimensions by shape:

ShapeDimensions
Rectangular, Vertical ovalWidth, Depth, Straight height
Vertical cylinder, Vertical capsule, Vertical dished ends, ConeDiameter, Straight height
SphereDiameter
FrustumBottom diameter, Top diameter, Straight height
Horizontal cylinder, capsule, 2:1 elliptical ends, dish endsDiameter, Length
Horizontal ellipseWidth, Straight height, Length
UnknownTotal capacity

Edge cases:

  • A missing or non-positive dimension, a missing level key or a non-numeric reading puts the card in the Configuration error state and shows the reason.
  • A tank with no reading yet shows No data.
  • For dish-end shapes, leave Volume per head empty to estimate each head as 0.0809 x diameter cubed (ASME F&D), or enter the value from the vessel datasheet for an exact result.
  • With Clamp to tank on, readings above full or below empty are drawn as full or empty.
  • Height mode needs a real shape and its dimensions. It does not work with the Unknown shape.

How to customize

  • To show many tanks at once - point the datasource at an entity alias that resolves to several devices or assets; the widget switches to a grid on its own. Under Multiple tanks, use Fit columns or a fixed Columns count, and adjust Minimum card width and Card gap.
  • To put the worst tanks first - under Multiple tanks, set Sort tanks by to Status, most severe first or Level, lowest first.
  • To match a real vessel - pick the Shape, set Dimension units and fill in the dimensions listed for that shape.
  • To support tanks of different shapes in one grid - set Shape from to Attribute and store the shape and dimensions as attributes on each entity.
  • To change the alert levels - edit the rows under Set points. Set Trips when level to Falls below or Rises above, choose Severity and Measured in, and enable the row. Use Add set point for more rows.
  • To stop the status from flickering - raise Deadband (percent of total volume) and Hold (ms) on the set point.
  • To keep one liquid colour - turn off Colour by status and pick the Liquid colour under Appearance.
  • To show the value in different units - set Source units to what the sensor sends and Display units to what users should see, e.g. source m3, display L.
  • To control text size yourself - turn off Auto scale under Appearance and set the fonts for each line.
  • To change the card background, corner radius or padding - use the standard card settings: Card appearance in basic mode, or the Widget card tab in advanced mode.
  • To declutter the card - toggle Label, Value, Percent, Capacity and Timestamp under Appearance, and turn on or off Threshold markers and Scale ticks.
  • To open details on click - add an action for the On tank click source in the widget’s Actions tab.
  • To improve performance on large grids - lower Animate up to, or turn off Animate level.

Tips

  • If you only know a tank’s capacity and not its dimensions, use the Unknown shape. Percent and volume are still exact, only the drawn height is linear.
  • Store per-tank set points as attributes so the same dashboard works for tanks with different alarm levels.

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.