Skip to main content
ParticleUI

Dropdown Menu

Accessible dropdown with items, checkboxes, radio groups, labels, and submenus.

Installation

1

Run the CLI

$npx particleui-cli add dropdown-menu

Usage

TSX
import {
  DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem,
} from "@/components/ui/dropdown-menu"
import { Button } from "@/components/ui/button"

export default function Example() {
  return (
    <DropdownMenu>
      <DropdownMenuTrigger asChild>
        <Button variant="outline">Open</Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent>
        <DropdownMenuItem>Profile</DropdownMenuItem>
        <DropdownMenuItem>Settings</DropdownMenuItem>
        <DropdownMenuItem>Log out</DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  )
}

Details

Source filecomponents/ui/dropdown-menu.tsx
Typeui
Categoriesoverlay, core
npm dependencies@radix-ui/react-dropdown-menu, lucide-react
Registry deps
Claude skill