# Quick action menu

> Quick action menu

A shadcn/ui block from the [@reui](https://reui.io) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/reui/c-dropdown-menu-16).

- Page, with a live preview: https://shadcn.exchange/r/reui/c-dropdown-menu-16
- Screenshot: https://abzjhwgwpdpz7ua5.public.blob.vercel-storage.com/shots/reui/c-dropdown-menu-16-light-0d0081199a04239d.png
- Registry item: https://reui.io/r/new-york-v4/c-dropdown-menu-16.json
- Listed: 2026-10-13, source last changed 2026-10-13

## Install

```bash
npx shadcn@latest add https://reui.io/r/new-york-v4/c-dropdown-menu-16.json
```

Run it in a project that has shadcn/ui set up. It adds the files below and installs what they depend on.

## Dependencies

- Registry items: `button`, `dropdown-menu`

## Files

### `c-dropdown-menu-16.tsx`

```tsx
import { Button } from "@/components/ui/button"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuGroup,
  DropdownMenuItem,
  DropdownMenuSeparator,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"

const icons = {
  more: (
    <IconPlaceholder
      lucide="MoreHorizontalIcon"
      tabler="IconDots"
      hugeicons="MoreHorizontalCircle01Icon"
      phosphor="DotsThreeIcon"
      remixicon="RiMoreLine"
      aria-hidden="true"
    />
  ),
  settings: (
    <IconPlaceholder
      lucide="SettingsIcon"
      tabler="IconSettings"
      hugeicons="Settings01Icon"
      phosphor="GearIcon"
      remixicon="RiSettings3Line"
      aria-hidden="true"
    />
  ),
  share: (
    <IconPlaceholder
      lucide="Share2Icon"
      tabler="IconShare"
      hugeicons="Share08Icon"
      phosphor="ShareNetworkIcon"
      remixicon="RiStackshareLine"
      aria-hidden="true"
    />
  ),
  trash: (
    <IconPlaceholder
      lucide="TrashIcon"
      tabler="IconTrash"
      hugeicons="DeleteIcon"
      phosphor="TrashIcon"
      remixicon="RiDeleteBinLine"
      aria-hidden="true"
    />
  ),
}

export function Pattern() {
  return (
    <DropdownMenu>
      <DropdownMenuTrigger
        render={
          <Button
            variant="ghost"
            size="icon"
            className="-me-1.5"
            aria-label="More options"
          />
        }
      >
        {icons.more}
      </DropdownMenuTrigger>
      <DropdownMenuContent align="start" className="w-36">
        <DropdownMenuGroup>
          <DropdownMenuItem>
            {icons.settings}
            Settings
          </DropdownMenuItem>
          <DropdownMenuItem>
            {icons.share}
            Share
          </DropdownMenuItem>
          <DropdownMenuSeparator />
          <DropdownMenuItem variant="destructive">
            {icons.trash}
            Remove
          </DropdownMenuItem>
        </DropdownMenuGroup>
      </DropdownMenuContent>
    </DropdownMenu>
  )
}
```