HTML <meter> Tag

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

☕ Buy a Coffee

Description

The <meter> HTML tag is used to represent a scalar measurement within a known range or a fractional value. It is typically employed to display gauges, progress bars, or other visual representations of data with a clear minimum and maximum value. The <meter> tag includes attributes like value to specify the current measurement, min to set the minimum acceptable value, and max to set the maximum acceptable value. This tag is particularly useful for conveying information about the status or progress of a task, such as file uploads, completion of a survey, or battery levels in a graphical manner on web pages.

Properties

Permitted Parents: Any element that accepts phrasing content
Content: Inline and text, but no <meter> among its descendants
Start/End Tags: Start tag: required, End tag: required

Example

HTML

<p>Average Review: <meter value="3" min="0" max="10">3 out of 10</meter> 3/10</p>

<p>Site Completion: <meter value="0.7">70%</meter> 70%</p>

Result

Editor

Attributes

Attribute	Definition
form	Specifies one or more forms the [meter] element belongs to
high	Specifies the range that is considered to be a high value
low	Specifies the range that is considered to be a low value
max	Specifies the maximum value of the range
min	Specifies the minimum value of the range
optimum	Specifies what value is the optimal value for the gauge
value	Required. Specifies the current value of the gauge