Add Breadcrumb component
- Dominant language
- TypeScript
- Stars
- 10.9k
- Forks
- 543
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 101
Description
## Summary
Add a **Breadcrumb** component to the MUI Base UI library. This component would provide a lightweight, unstyled primitive for building breadcrumb navigation patterns, allowing developers to implement consistent navigation hierarchies across applications.
## Examples in other libraries
- [Radix UI – Breadcrumbs (community implementations)](https://www.radix-ui.com/)
- [Chakra UI – Breadcrumb](https://chakra-ui.com/docs/components/breadcrumb)
- [Ant Design – Breadcrumb](https://ant.design/components/breadcrumb/)
These libraries provide flexible breadcrumb primitives that can be styled or extended, serving as good references for API design and accessibility considerations.
## Motivation
Breadcrumbs are a common navigation pattern in modern web applications, especially for:
- **Hierarchical navigation**: Allowing users to understand their current location within nested routes or sections.
- **Improved UX**: Providing quick access to higher-level pages without relying solely on back buttons or menus.
- **Accessibility**: Offering screen reader–friendly navigation landmarks.
Currently, MUI Base UI does not include a breadcrumb primitive, which means developers must either:
- Rebuild this pattern from scratch, or
- Depend on higher-level libraries that may not align with the unstyled, headless philosophy of Base UI.
Adding a Breadcrumb component would:
- Improve **developer productivity** by providing a ready-to-use, accessible primitive.
- Ensure **consistency** across projects using MUI Base UI.
- Align with the library’s goal of offering unstyled building blocks for common UI patterns.
Contributor guide
Assessment
This issue has not been assessed yet.