Member-only story
7 Cool HTML Elements Nobody Uses

Searching for cool HTML elements, especially if you don’t know what you’re looking for, is often like being thrown into a pile of garbage

Don’t worry, I did the dirty work for you!
After scavenging through the seemingly endless pile of HTML elements, I dug up a few of the rarely used gems!
1. meter
& progress
The progress
element is the semantically correct way of displaying progress bars.
The meter
element is progress
on steroids. Apart from displaying a scalar measurement within a known range, it allows you to specify the value's low, high & optimum range.
<meter
min="0"
max="100"
low="25"
high="75"
optimum="80"
value="50"
></meter>

2. sup
& sub
You can add superscripts (like x²
) with sup
and subscripts (like x₀
) using sub
to your document.


3. datalist
datalist
allows you to add an autocomplete suggestions to your input
elements.

NOTE
- The suggestions are NOT LIMITED to text
inputs
, but can be used with color, date, time, and even range inputs. - The default styling of the suggestions is unpleasant to look at, to say the least. But, you can always style it using CSS.