Easily show a range/gauge with HTML <meter> element

Direct Link

• 🔗 developer.mozilla.org/en-US/docs/Web/HTML/Element/meter

I really had no idea about the HTML <meter> element that can show a range of values, until I read this tweet by Álvaro Trigo 😃

Example: §

<meter min="0" max="100"
	low="30" high="80" optimum="60"
	value="70">

Result:

Note: The <meter> tag should not be used to show the progress of a task. Use the <progress> tag instead.