Select

The select and search controls allow the user to select an option or options.

Select menus in Base hover atop of a selection menu while providing a simple list of options. Proper spacing, color, and a check-mark are clear indicators of a selection. Each menu is scrollable, if applicable.

Examples

Select Basic usage
Select...
open
Select as Single Pick Search
search
Choose a color
Select as Multi Pick Search
search
Choose a color
Select With Many Options
Select...
open

Overrides

Additionally, you can fully customize any part of the Select through the overrides prop. The Select consists of multiple sub-components that are listed bellow and you can override each one of them. To help you identify the names of these sub-components, you can highlight them through this selector:

search
Select...
Select...
open