• Docs
  • Components
  • Blocks
  • Admin
CtrlK
Get Started
  • Introduction
  • Setup
  • CLI
  • VS Code Extension
  • Figma Code Connect
  • MCP Server
  • llms.txt
  • Changelog
Foundations
  • Design Tokens
  • Theming & Modes
  • Semantic Colors
  • Spacing
  • Typography
Testing
  • Test Guide
  • Performance Tests
  • Visual Regression
Components
  • Accordion
  • Activity Feed
  • Alert
  • Avatar
  • Badge
  • Breadcrumbs
  • Button
  • Card
  • Carousel
  • Checkbox
  • Collapsible
  • Combobox
  • Command Palette
  • Context Menu
  • Date Picker
  • Dialog
  • Dropdown Menu
  • File Upload
  • Hover Card
  • Input
  • Kbd
  • Label
  • Menubar
  • Metric Card
  • Multi Select
  • Navigation Menu
  • Pagination
  • Popover
  • Progress
  • Quick Actions
  • Radio
  • Rating
  • Resizable
  • Segmented Control
  • Select
  • Separator
  • Sheet
  • Skeleton
  • Slider
  • Spinner
  • Split Button
  • Stepper
  • Switch
  • Table
  • Tabs
  • Tag Input
  • Textarea
  • Timeline
  • Toast
  • Toggle
  • Toggle Group
  • Tooltip
  • Tree View
Blocks
  • Activity Feed
  • App Shell
  • Authentication Block
  • Benefits Section
  • Cta Section
  • Data Table
  • Empty State
  • Faq Section
  • Feature Grid Section
  • Footer Section
  • Hero Section
  • Kpi Dashboard
  • Kpi Strip
  • Link Card
  • Metric Card
  • Navigation Header
  • Pagination Footer
  • Pricing Table
  • Quick Actions
  • Settings Screen
Resources
  • API Reference
DialogFile Upload
DialogFile Upload
DialogFile Upload

Dropdown Menu

Display a list of actions or options.

Dropdown Menu Example

Default

With Submenu

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61

Install

API Reference

ComponentPropTypeDefaultDescription
DropdownMenuopen?, onOpenChange?, modal?boolean, function, boolean—Root component. Must contain DropdownMenuTrigger and DropdownMenuContent
DropdownMenuTriggerasChild?booleanfalseTrigger element that opens the menu
DropdownMenuContentside?, align?, sideOffset?, className?string, string, number, string—Container for menu items
DropdownMenuIteminset?, disabled?, className?boolean, boolean, string—Standard menu item
DropdownMenuLabelinset?, className?boolean, string—Section label for grouping items
DropdownMenuSeparatorclassName?string—Visual separator between menu sections
DropdownMenuCheckboxItemchecked, onCheckedChange, className?boolean, function, string—Menu item with checkbox state
DropdownMenuRadioItemvalue, className?string, string—Menu item with radio state (use within DropdownMenuRadioGroup)
DropdownMenuSub———Container for submenu (use with DropdownMenuSubTrigger and DropdownMenuSubContent)
DropdownMenuSubTriggerinset?, className?boolean, string—Trigger for submenu