Also known as:
Button with dropdownDropdownSegmented button

Split Button

Split buttons let you immediately perform an action or choose additional options from a dropdown.

Need to know

  • Avoid split buttons where separated buttons and icon buttons will do.
  • Only include related actions in the dropdown.
  • Don’t use links in the dropdown.

To keep in mind

Sometimes there’s not enough space for a separate Button and Icon button, and they both control closely related actions.

  • See Button guidelines.
  • See dropdown guidelines.
  • RTL: the segmented chevron appears on the left.

When to use

Use when there’s not enough space for a separate Button and Icon button, and they both control closely related actions.

When not to use

  • Don’t use a button when navigation is involved. Instead, use a link.
  • Don’t use a split button separate Button and Icon button will do.
  • If there’s only 1 action for the dropdown, try to use another button.

See also


External Links

Here are some examples of other existing design systems: