UI Components

Dropdown

A dropdown lets someone choose one option from a hidden list that opens on demand.

Also called Select menuPickerMenuPull-down menuChoice list

Visual Example

Try it: open the dropdown and choose a sort order.

Plain Definition

Dropdowns are useful when the available choices are known ahead of time and showing every choice at once would take too much space.

They work best for compact, familiar choices such as status, country, role, or sort order. If the list is long or people need to type to narrow it down, the pattern may need search or autocomplete later.

You Might Describe This As...

  • "menu that opens down"
  • "click to choose from a list"
  • "list of options that drops open"
  • "select one option from hidden choices"

Fast lookup

You May Also Mean

Dropdown is often mixed up with Modal because the patterns can organize or reveal similar content in different ways.

What It Is Used For

  • Choosing a country
  • Filtering a list
  • Selecting a setting

Example User Phrasing

  • "I want a pull-down list of choices."
  • "Let people choose one option from a menu."