Split button

A split button is a type of button that includes additional options (or actions) related to its primary function, which are placed under an overflow menu as icon buttons.




Figma component

Includes a link to a Figma component that has been imported to Supernova


Use when

  1. needed to show actions related to the primary function or that can be performed subsequently.
  2. to indicate that secondary actions are contextually related to a function.

Don't use when

  1. there is a lack of context or when the function is not closely related to the primary function. Instead, use a button.
  2. navigating between pages or states. Instead, consider using a content switcher.


Split button's icon button collapse version (above) and expand version (below).

Split button's icon button collapse version (above) and expand version (below).

  1. Button (Primary CTA)
  2. Icon Button
  3. Overlflow menu




It should be used to indicate the primary action or actions to be taken on a record on show pages.


Secondary split button can be used when emphasizing a secondary action that is not the primary action or actions to be taken on a record. It can be used in conjunction with the primary type.


It should be used when listing actions related to a record, especially for the action that is least important. If a primary or secondary button is not used on the relevant page, it is not recommended to use.



It can be used on widgets in web interfaces.


Large can be preferred for installation or setup stages.


It can be used in windows such as modals when required.



Split button should be used in places where it is relevant to the type of data displayed, such as the show page of a record and its corresponding widgets.

Overflow menu placement


The overflow menu should be aligned to the right of the icon button (and the split button as a whole). This way, the actions listed in the overflow menu can appear contextually related to the primary action of the split button.

The items in the overflow menu should be ordered in terms of importance, from most relevant to least relevant.