Context Menu
ProRight-click triggered overlay menu with grouped actions, keyboard shortcut hints, and separator dividers. Includes danger-styled items for destructive actions. Positions at the cursor location and adjusts to stay within the viewport.
4 variants
Variants
| Variant | Description | When to use |
|---|---|---|
| Default | Standard right-click context menu with action items and keyboard shortcuts. | Use for contextual actions on content items — files, table rows, cards. |
| With Submenus |
Usage Guidelines
Do
Show keyboard shortcut hints beside each action.
Don't
Use as the only way to access important actions — many users never right-click.
Do
Group related items with separators.
Don't
Override the browser's default context menu on text content.
Do
Always offer the same actions through other UI paths — context menus aren't discoverable.
Don't
Nest context menus within context menus.
Code
Design Tokens
Accessibility
- Same ARIA pattern as Dropdown Menu — role="menu" and role="menuitem".
- Must be dismissable with Escape key.
- All context menu actions must also be available through visible UI controls.