Capacity

Display an capacity indicator.

The basic Capacity usage.

Specify a color to override the default.

Pair each Capacity with a label and the numbers. limit is the full bar, and the color changes by itself as it fills.

Attribute	Description	Type	Accepted values	Default
value	value number	`number`	-	0
limit	max value	`number`	-	100
color	css color string	`string`	-	-
...	native props	`HTMLAttributes`	`'className', ...`	-

• Without a name the bar is a plain div, so a screen reader does not announce it. Pass an aria-label or aria-labelledby, such as aria-label="Storage used", and it becomes a meter with aria-valuenow as the value, aria-valuemin 0 and aria-valuemax as the limit.