Select
A form field that opens a list and stores one chosen option, such as a country, timezone, or shipping speed.
See it
What it is
A select is a form control for choosing one value from a fixed list. The closed control shows the current choice; opening it shows the available options. Country, timezone, and shipping speed are classic examples. The native HTML 'select' element hands the actual picker to the browser and operating system, which is why iOS shows a spinning wheel at the bottom of the screen while a desktop browser drops a plain list under the field.
Reach for a select when the choices are known in advance, mutually exclusive, and too numerous for a short row of radio buttons. If people need to type and filter a long list, use a combobox. If each row runs an action rather than choosing a stored value, use a dropdown menu.
Gotcha: a placeholder is not a label. Keep a visible label above the control, and if choosing is required, start with a disabled empty option such as 'Choose a country'. Custom selects have to rebuild keyboard navigation, focus, type-ahead, mobile behavior, and form submission, so the native element is the safer default.
Ask AI for it
Build a labelled single-choice form control with the native HTML 'select' and 'option' elements. Put a visible Country label above it, connect the label with for and id, and begin with a disabled value='' option reading 'Choose a country'. Make the field full width with a 44px minimum height, 12px horizontal padding, a custom chevron using appearance: none, and a strong :focus-visible outline. Preserve native keyboard type-ahead, browser validation with required, form submission by name, disabled styling, and an inline error message connected with aria-describedby.