PIDSTACK
Account

Level gauge glass

Pro

level-gauge · P&ID · Inline elements · 48×72 grid units

X-101

Five states

  • Running
  • Warning
  • Failure
  • Stopped
  • No data

Four themes

Level gauge glass in each theme (rows) and state (columns)
ThemeRunningWarningFailureStoppedNo data
Day
Bright
Dusk
Night

About this symbol

Meaning
gauge glass
Convention
ISO 10628 (ISO (opens in a new tab))
Tags
Access
Pro: preview is open; code and files come with Pro or Lifetime.

Drawn from scratch. The convention names the meaning the symbol stands for; no standard text or figure is reproduced.

Install with the shadcn CLI
npx shadcn@latest add "https://pidstack.com/r/level-gauge.json?api_key=$PIDSTACK_LICENSE_KEY"

Pro items need a license key from your account. See how keys work.

Use in React
import { LevelGauge } from "@/components/pidstack/level-gauge"
import "@/components/pidstack/pidstack.css"

<div data-theme="day">
  <LevelGauge state="running" label="X-101" size="medium" />
</div>

SVG file and component code are in Pro

The full library ships as typed React components, plain SVG files and a JSON manifest, through the registry, the MCP server and a ZIP download.

See plansFree starter pack

More in Inline elements