Shadcn.io is not affiliated with official shadcn/ui
Breadcrumb with Dropdown
A breadcrumb navigation with home icon and dropdown menu to reveal collapsed navigation segments
Breadcrumb ellipsis that does something—dropdowns reveal the hidden middle. This React breadcrumb combines shadcn/ui's DropdownMenu with breadcrumb navigation, using a Home icon for root and Folder icon for expandable segments. Built on Radix UI, clicking the folder icon reveals collapsed navigation paths. Perfect for file managers with branching directories, documentation with multiple section paths, content hierarchies with alternative routes, or any navigation where users need access to hidden intermediate levels—provides full navigation without permanent visual clutter.
Breadcrumb with Dropdown preview
Installation
Related Components
Breadcrumb with Ellipsis
Collapsed non-interactive breadcrumb
Standard Breadcrumb Dropdown
Text-based home with dropdown
Breadcrumb with Select
Select-based navigation switching
Dropdown Menu
Standard dropdown component
Breadcrumb with Icons
Icons throughout navigation
Navigation Menu
Complex navigation patterns
FAQ
Was this page helpful?
Sign in to leave feedback.