A menu renders a list of actions or selectable options, usually opened from a control such as a button, to create a dropdown of related actions.
Figma
The Figma reference for Menu will appear here once the design link is added.
Storybook
Interactive examples for Menu will render here once the Storybook link is wired in.
Best practices
- Use it for secondary or less important actions that stay hidden until opened.
- Group actions that relate to one another.
- Make each item clear and predictable so people can anticipate what it does.
Do’s and don’ts
Do
Lead each item with a strong verb, using verb + noun for clarity: “Add to watchlist”, “Download inspection report”.
Don’t
Use a bare, ambiguous verb where context is missing: “Buy”.