Select
The Select component allows users to choose one or multiple items or options from a list.
Guidelines
A select can be used in different settings:
- to filter or sort content on a page
- to submit data
Singleselect versus multiselect variant
The singleselect
variant is used to choose only one option from a list.
The multiselect
variant is used if multiple choices can be applied.
A native select component is also available for implementation. We recommend using native select on product with limited space as it provide a better user experience.
Best practices
Use clear and simple language in the placeholder text. It will help the user to understand what they are expected to choose from.
Order your list of options in a way that will make the most sense to the user:
- alphabetically
- numerically
- by most commonly selected option
Display a maximum of six items/options at a time.
Implementation
A native select component is also available for implementation. We recommend using native select on products with limited space as it provides a better user experience.