Action bars

An action bar is a horizontal container that is placed along the bottom edge of a window. It is used to present actions for the content that is displayed above.

When to use

Use an action bar when content items are primarily displayed for editing or management. Since they prominently display potential actions, action bars are not appropriate if content is generally viewed and not edited. In these cases, potential actions can be placed within a header bar menu instead.

Action bars can be shown temporarily, when a selection or edit mode is active.

Guidelines

  • Group sets of similar functionality together, by aligning them to the left and right of the action bar, or by using separators. The most commonly used items should be placed on the left.

  • Try to separate potentially destructive actions, and style them appropriately.

API reference