Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Dropdown Menu - Dropdown with Checkboxes
A React dropdown menu with interactive checkboxes for toggling UI visibility options like Status Bar, Activity Bar, and Panel built with shadcn/ui
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Ever buried view toggles in nested settings menus only to watch users struggle to find them? This React dropdown menu puts visibility controls front and center with checkboxes for Status Bar, Activity Bar, and Panel. Built with shadcn/ui and Radix UI with DropdownMenuCheckboxItem, it's perfect for IDE-style interfaces, dashboard customization, or any app where users want quick control over what they see.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Dropdown with Radio Items
Single-select options with radio buttons
Mixed Features Dropdown
Combines checkboxes with other controls
Filter Panel Drawer
Side panel with checkbox filters
Filter Popover
Compact filtering interface
Settings Dialog
Modal for configuration options
Context Menu with Checkboxes
Right-click menu with toggles
Questions you might have
React Dropdown Menu - Dropdown with Shortcuts
A React dropdown menu displaying keyboard shortcut badges alongside action items for Copy, Cut, Paste, Search, and Delete built with shadcn/ui
React Dropdown Menu - Dropdown with Radio Items
A React dropdown menu with radio button items for selecting mutually exclusive panel position options Top, Bottom, Right, or Left built with shadcn/ui