Combobox

How to use a combobox

A combobox allows users to filter or search for options in a list by typing into a text field. Use a combobox when the list of options is complex enough to require searching, filtering and custom input functionality.

When using a combobox:

• Keep the options as short as possible as long option descriptions can cause the text to get truncated
• Use clear and concise labels that describe the purpose or function of the combobox
• Use supporting text to make it clear to the user what type of information to input

Don't use a combobox if the list contains only a few options.

Types of combobox

Single select

The single select combobox allows the user to search or select one item from a dropdown list.

Multi select

The multi select combobox allows users to search and select multiple options from a dropdown list. The selected options are represented as dismissible tags within the search field filter.

With button

Use a button if the user has to submit the selected options and show results on another page, for example when used as a search. Without a button, the combobox can populate results underneath asynchronously.

Content guidelines

Try to limit each item in the list to one or two words.

Was this page helpful?