vocab.design

component · forms

Dropdown

also called drop-down, dropdown menu

The loose everyday word for any panel that opens downward from a trigger, whatever the panel holds and whatever the trigger does with it.

This entry exists because the word is contested, not because the widget is unnamed. A dropdown is a shape: something small that you press, and a panel that appears below it. That is the whole of what the word promises. It says nothing about whether the panel holds values or verbs, whether the trigger keeps what you choose, or whether you can type into it, which is why two people using the word confidently can be describing two different components.

Almost everything called a dropdown is really one of three things. If the panel holds values and the trigger afterwards reads back the one you picked, it is a select. If the panel holds commands and the trigger reads the same after you choose, the trigger is a menu button and the panel is its menu, often built from an action list. If there is a text field you can type into and the list narrows as you type, it is a combobox. A context menu is the near miss that proves the geometry is the whole of the word: it holds commands like a menu but has no trigger to drop from, appearing at the pointer instead, so nobody calls it a dropdown.

The loose word survives anyway because the geometry is real and worth naming. Two controls that behave nothing alike still share a placement problem: the panel has to be anchored to the trigger, has to flip above it near the bottom of the viewport, has to be out of flow so opening it does not shove the layout around, and has to be dismissed the same three ways (choose, Escape, click outside). Every design system ends up with one positioning primitive serving all of them, and “dropdown” is the name that primitive usually gets. Radix even keeps the loose word for the precise thing: its Dropdown Menu is a menu button plus a menu, nothing else. When the panel outgrows one column and shows a whole section of a site at once, it has become a mega menu; when the options form a tree explored one level at a time, a cascader.

The practical rule is short. In conversation, dropdown is fine and everyone will follow you. In a ticket, a spec, a component name, or an accessibility review, use the precise word, because the three candidates have three different keyboard contracts and three different ARIA shapes, and a ticket that says “fix the dropdown” does not say which one is owed. If you inherit a component actually named Dropdown, read its markup before you trust the name: role="menu" and aria-haspopup="listbox" are the two answers, and plenty of libraries ship the first while documenting the second.

Which word?

If you wantsay
the loose word for anything that opens downwarddropdown
one choice from a known list, no typingselect
a text field that filters a list as you typecombobox
the button opens a list of commands, nothing moremenu button
actions for the exact thing you invoked them oncontext menu

Implementations

Specimens illustrate the concept; for production use, start here.

radixDropdown Menu
carbonDropdown

Sources