• Light
  • Dark
  • Night vision
English

Language

Palette

  • Light
  • Dark
  • Night vision

Dropdown button

1 minute441 views

Alternative name: selector.

The dropdown button is a variant of the button that shows a dropdown panel or list. The label or icon of the button describes the panel that will be shown or highlights the option of the list that is selected.

Connection with other controls

Because dropdown button is just a button, the only task of which is to show the panel/list, it should share the same style as other buttons of the application, but has the triangle (or two triangles) icon to highlight the behavior of the button.

All the surface of the button is a click area, so it shouldn’t look similar to the combobox, which has two separate click-sensitive surfaces, one of which activates the text input (sets the keyboard focus), and another triggers a dropdown list.

Compact version

In case of the limited space, the dropdown button may have a corner triangle to expand the area, that can be used for label or icon of the button.

See also