User needs to perform an action, and depending on space constraints or the frequency of use, the action does not need to be visible at all times.
Menus provide a list of available actions and options. They’re used in dropdowns, selects, and context menus.
Menus appear relative to the control or interaction that triggered the menu. Clicking an item from the menu performs the action or selects the option. For most actions, the menu should close when a menu item is clicked. If the clicked menu item is part of a set of multi-selectable options, then the menu should stay open.
Menus may have submenus, icons, dividers, category labels, and checkboxes
Menu items may change depending on the context (e.g., Mark as read vs Mark as unread)
Use dividers to group related menu items
Use submenus to separate large sets of menu items
Include keyboard shortcuts if applicable
Disable menu items rather than hiding to improve discoverability of features
Sometimes menus can contain form elements like checkboxes. Use checkboxes for both single and multi-select options. When dealing with a multi-selectable collection of checkboxes, it’s likely beneficial to keep the menu open after items are checked. Otherwise, menus should close after items are clicked.