Prioritize the most important actions. Use secondary styles wisely.

Use button combinations consistently to help the user understand related actions. Primary and secondary buttons are always paired together.

Place commonly used actions in a consistent and familiar location.

Correctly utilize the corresponding disabled state style for each button. Do not reduce button opacity to indicate "disabled".

Buttons are used primarily for actions, such as “Add”, “Close”, “Cancel”, or “Save”. Plain buttons, which look similar to links, are used for less important or less commonly used actions, such as “view shipping settings”.

For navigational actions that appear within or directly following a sentence, use the link pattern. Links are used primarily for navigation, and usually appear within or directly following a sentence.

Button groups are used to group related actions, not as an element for navigation between different types of data. Consider tabs for this type of interaction. See Tabs.

Button groups provide higher visibility while dropdowns save space, so consider users' needs for the context.

Use a button group with a dropdown button when you want to group a default action with several variations of that same action.