Action Button

Action Buttons let users select an option in a menu of multiple options without executing it immediately.

Usage


Action Button VS Multi Button

Action Buttons lets users select an option in the menu without executing said option, on Multi Buttons, the action will trigger once an item in the menu is clicked.

When to use a Basic Button VS Action Button

Use when related actions can be grouped in a dropdown and activated only by clicking on a labeled button. unlike the Action Button, there is no “default” action.

Do
A multi-button with two dropdown options

Use the multi-button when there’s more than 1 option available

Don't
An action button with one dropdown option.

Avoid using the Action Button when there is only 1 action option available.

Don't
Three primary buttons listing out different actions.

Avoid listing out the individual action options with basic buttons. This is especially true of the primary button as there should only be 1 primary button per application area.

Use concise labels

Do
An action button stating 'Add Form'.

Use clear and to-the-point language.

Don't
An action button stating 'List of new form options'.

Limit the label length and do not use punctuation marks.

Use unambiguous text

Do
An action button stating 'Save Form'

Unless the context around the multi-button is clear, the Action Button text should be direct about the action's outcome.

Don't
An action button stating 'Save'

Unless the context is clear, avoid ambiguous text.