Component

Dropdown Menu

Click-triggered menu (wraps Base UI Menu).

Basic

A short, known list of actions tied to a single trigger - a user avatar's menu, a row's "more actions" button, a toolbar overflow.

Site navigation with hover-revealed content panels - use Navigation Menu instead.
A right-click-triggered menu - use a visible Dropdown Menu trigger instead so the action also works on touch devices.
A long, searchable action list - Command Menu's filtering is a better fit past a handful of items.

Key	Action
Enter / Space / ArrowDown	Opens the menu from the trigger.
ArrowUp / ArrowDown	Moves the highlighted item.
Enter	Activates the highlighted item.
Escape	Closes the menu and returns focus to the trigger.

Opens on tap identical to desktop click - no separate touch affordance needed.
Items keep a minimum touch-friendly height so a dense menu doesn't produce mis-taps on small screens.

Base UI applies role="menu"/"menuitem" with a roving tabindex, so only one item is a Tab stop at a time.
DropdownMenu.Separator is exposed with role="separator" so it's skipped by item navigation but still structurally present for screen readers.

Putting a form control (checkbox, input) inside a plain DropdownMenu.Item instead of using the dedicated checkbox/radio item variants where available - plain items commit and close on selection.
Triggering it from a non-button element without forwarding the render prop correctly, which drops keyboard support.

Prop	Type	Default	Description
align	"start" \| "center" \| "end"	"start"	Horizontal alignment against the trigger.
className	string	None	Extra classes merged onto the menu surface.

align"start"

"start" | "center" | "end"

Horizontal alignment against the trigger.

classNameNone

string

Extra classes merged onto the menu surface.

Criterion	Status	Note
Keyboard support	Supported	Arrow-key roving tabindex, Enter to activate, Escape to close.
Focus management	Supported	Focus returns to the trigger on close.
Screen reader labels	Supported	role="menu"/"menuitem" applied by Base UI automatically.
Reduced motion	Supported	prefers-reduced-motion: reduce zeroes all Fuji transition durations globally.
Reduced transparency	Supported	prefers-reduced-transparency: reduce flattens Glass to opaque surfaces (portals included).
RTL layout	Partial	Logical flex/grid gap works under dir="rtl"; directional chevrons are not yet mirrored.

Prop	Type	Default	Description
native props	HTML attributes	None	Use Trigger, Content, Item, Separator, and related compound parts.
className	string	None	Additional classes applied to the component root.

native propsNone

HTML attributes

Use Trigger, Content, Item, Separator, and related compound parts.

classNameNone

string

Additional classes applied to the component root.