SURFACES
Sliders allow users to make selections from a range of values.
<label for="countries" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Choice Best</label>
<select id="countries" class="bg-gray-100 text-gray-700 dark:text-gray-300 dark:bg-slate-900 bg-opacity-20 w-fit py-1 px-3 border border-gray-300 text-sm rounded-lg focus:outline-none">
<option selected class="text-gray-700 dark:text-gray-300 hover:bg-green-300">React js</option>
<option value="Vue" class="text-gray-700 dark:text-gray-300 hover:bg-green-300">Vue js</option>
<option value="Next" class="text-gray-700 dark:text-gray-300 hover:bg-green-300">Next js</option>
<option value="Nuxt" class="text-gray-700 dark:text-gray-300 hover:bg-green-300">Nuxt js</option>
<option value="Vw" class="text-gray-700 dark:text-gray-300 hover:bg-green-300">Vw js</option>
</select>