Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Compact Menubar
Compact Menubar component with single Options menu containing minimal Settings and Sign Out items for simple applications built with shadcn/ui
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Not every app needs File, Edit, View—sometimes you just need Settings and Sign Out. This React Menubar provides single compact Options menu with essential actions separated by MenubarSeparator. Built with shadcn/ui and Radix UI primitives, compact menubar adds desktop-style navigation without overwhelming simple interfaces—perfect for minimal web apps, dashboards with few actions, viewer applications, kiosk modes, or any simple interface needing professional menu without extensive feature set.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Simple Text Menubar
Basic single-menu File menubar
Application Menubar
Complete menubar with multiple menus
Dropdown Menu
Context menu alternative to menubar
Menubar with Destructive
Menu with destructive Sign Out action
Navigation Menu
Site navigation alternative
User Menu
User-specific dropdown menu
Questions you might have
React Simple Text Menubar
Simple text-only Menubar component with single File menu and basic actions for desktop-style navigation built with shadcn/ui
React Menubar with Shortcuts
Menubar component with MenubarShortcut displaying keyboard shortcuts next to menu items for Edit actions built with shadcn/ui