Meter

Show a measured value within a known range.

Live example

A reviewed public example, isolated from this page.

import {
  MeterRoot,
  MeterIndicator,
} from "heidi-ui/meter";
import "heidi-ui/meter/base.css";

Copy this one primitive from its hosted source recipe or install the whole package from the Heidi UI overview.

indicator<div>
Fill bar; size set structurally from value relative to min/max.
Uses native semantics
root<div>
The meter track; requires an accessible name via label and a numeric value.
ARIA role: meter