Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Menubar with Checkboxes
Menubar component with MenubarCheckboxItem for toggleable View options like Show Toolbar and Status Bar built with shadcn/ui
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
View menus let users toggle interface elements—Show Toolbar, Show Sidebar, Show Status Bar. This React Menubar uses MenubarCheckboxItem components with checked state displaying checkmarks next to options. Built with shadcn/ui and Radix UI primitives, checkboxes provide clear visual feedback for toggleable settings—perfect for View menus in code editors, design tools, document processors, or any application where users customize visible interface elements without navigating to separate settings.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Simple Text Menubar
Basic menubar without interactive items
Menubar with Radio Groups
Mutually exclusive options with radio items
Application Menubar
Complete menubar with multiple menu types
Menubar with Sections
Organized menu with labeled sections
Checkbox Group
Multiple checkbox selection
Switch Component
Toggle switch for settings
Questions you might have
React Menubar with Icons
Menubar component with Lucide React icons next to menu items for visual action identification in File menu built with shadcn/ui
React Menubar with Radio Groups
Menubar component with MenubarRadioGroup and MenubarRadioItem for mutually exclusive Layout view options built with shadcn/ui