A menu displays a list of choices or actions in a temporary pop-up container. It is triggered by a user's interaction with an element like a button or dropdown, providing a compact way to present multiple options without cluttering the interface.
When to use
When to avoid
Specifications
Type
Anatomy
1
Lead icon
Optional and can be used to visually represent or reinforce the action of a menu item.
2
Trailing cheveron
Indicates that the menu item contains a nested submenu that will open on hover or click.
3
Supporting text
A secondary line of text for additional description.
4
Divider
Should be used to create visual groupings for related sets of menu items.
5
Menu item
Menus are made up of menu items in a list. Each menu item consists of a clear and concise text label that describes its action or navigation destination.