JSFiddle - React, Tailwind, and code Playground

by Ialimijoro

HTML

<div class="container">

<input type="range" list="tickmarks">

<datalist id="tickmarks">
  <option value="0" label="0%">
  <option value="10">
  <option value="20">
  <option value="30">
  <option value="40">
  <option value="50" label="50%">
  <option value="60">
  <option value="70">
  <option value="80">
  <option value="90">
  <option value="100" label="100%">
</datalist>

</div>

CSS

.container {
  margin-top:30%;
}