The menu button can be any of our standard button components to open the menu, including an Icon Button for an overflow menu (see below).
The menu list contains a list of links, buttons, dividers, or subheadings. Visually, it is bounded by a similar dropdown container to our autocomplete and select components. It may also be referred to as a menu dropdown.

An overflow menu is used to bundle multiple related or infrequently used actions. It helps to declutter the interface.
Use an overflow menu if you are short on space / screen real estate.
Consider using an overflow menu if you are presenting too many actions (E.g. more than 3) in the same row/space.
For an overflow menu, use an icon button with meatballs icon (i.e. three horizontal dots).
Overflow menus generally appear on the far right (in left-to-right languages) of a page or section layouts, to define a consistent location for users to look for.
Because overflow buttons (meatballs) are generally found on the right edge (in left-to-right languages) of a page, the menu list will need to align to the right edge (in left-to-right languages) of the icon button, so that the menu faces inward towards the content area, and doesn't appear outside of the content area.

A menu list should contain more than 1 action/link. If not, consider exposing these as individual actions.
For more than 6 menu items, chunk them into sections, separated by a content divider. Optionally, you may provide a subheading for each section.
Actions must be indicated with an icon. Links do not have an icon.
Action icons always live on the left of the action menu button.
Destructive actions are always at the bottom of the menu list using the destructive menu link style (see example).

Ensure people using keyboards can open and close the menu by pressing the button and access links and buttons within the menu list.

See Interaction states guidelines for focus indicators.
On keyboard navigation show focus indicator on top selector.
For menu select options show focus indicator on keyboard navigation and on click (not hover).

Copy guidelines

Use a noun for the menu button text to describe the links and actions contained within.

When to use and when not to use

When to use

Use a menu when there are link and button options available that are not used enough to show by themselves.

When not to use

When an option from the list becomes "selected", use a Select instead.
If there are only 2 list items, show them immediately inline instead of using a menu.
If you think you need 10 options, reconsider information architecture, page structure, and task flows to avoid including that many items in a menu.