Provide dropdowns for selecting options from a predefined list, enabling efficient data entry and user interaction.
<!-- Select --> <div class="relative mb-6"> <label for="select-basic" class="mb-2 block">Select</label> <select id="select-basic" class="w-full uajskeiolksb py-2 bg-primary-950 border border-primary-600 focus:shadow-xs focus:border-primary-300 focus:text-primary-300 placeholder-primary-500 focus:outline-hidden focus:ring-0 accent-primary-300"> <option value="" disabled selected>Select an option</option> <option value="option1">Option 1</option> <option value="option2">Option 2</option> <option value="option3">Option 3</option> </select> </div> <!-- Select Group --> <div class="relative mb-6"> <label for="select-group" class="mb-2 block">Select with Groups</label> <select id="select-group" class="w-full uajskeiolksb py-2 bg-primary-950 border border-primary-600 focus:shadow-xs focus:border-primary-300 focus:text-primary-300 placeholder-primary-500 focus:outline-hidden focus:ring-0 accent-primary-300"> <option value="" disabled selected>Select an option</option> <optgroup label="Group 1" class="text-primary-300"> <option value="group1-option1">Group 1 - Option 1</option> <option value="group1-option2">Group 1 - Option 2</option> </optgroup> <optgroup label="Group 2" class="text-primary-300"> <option value="group2-option1">Group 2 - Option 1</option> <option value="group2-option2">Group 2 - Option 2</option> </optgroup> </select> </div>