HTML <meter> tag

Updated: 11/13/2018 by Computer Hope

HTML meter tagWhen writing in HTML, the <meter> tag is an inline element used to create a gauge with a certain range on a web page. This gauge can be divided into either scalar or fractional values. It is useful for visually displaying where a certain value lies, between some minimum and maximum. For example, showing how much space has been used on a disk.

The following sections contain information about this tag, including an example of it in use, as well as related attributes and browser compatibility.

Note: The <meter> tag shouldn't be used to create a progress bar. In those cases, use the <progress> tag.

Example of <meter> code

<p>Your main disk's storage capacity is at: 
<meter min="0" max="250" value="175">175 out of 250 GB<meter>.</p>

Example result

Your main disk's storage capacity is at: 175 out of 250 GB.

Attributes

Within an HTML tag, an attribute dictates certain aspects of an HTML element. Attributes are made up of a name and value pair; all tags support standard attributes. The following table shows all of the current unique HTML attributes for the <meter> tag, as well as a description of each.

Attribute Description
form Designates the form(s) to which a <meter> element belongs.
high Designates a high value on the gauge's range.
low Designates a low value on the gauge's range.
max Designates a maximum range within a gauge.
min Designates a minimum range within a gauge.
optimum Designates an optimal range within a gauge.
value Designates the current value of the gauge (required).

Compatibility

Edge Internet Explorer Firefox Safari Opera Chrome
All versions Not supported 16.0+ 6.0+ 11.0+ 6.0+

Browser, Compatibility, URL, Web design terms