Navigation and disclosure · stable · MIT

Breadcrumb

Hierarchy navigation with current-page and collapsed-path parts.

Install editable source

Add Breadcrumb

Base UI / canonicalnpx shadcn@latest add https://gummyui.dev/r/gummy-breadcrumb.json

No package dependency beyond React. Shared Gummy material is resolved automatically.

Behavior contract

A labelled nav containing an ordered list and aria-current page.

Native link behavior.

Light and dark themes, logical RTL layout, reduced motion, responsive content, and forwarded public refs.

Source-derived reference

These public React parts are read directly from the canonical source during the documentation build.

Composes React.HTMLAttributes<HTMLElement> & { label?: string; }

Troubleshooting

If the material is missing, confirm the registry-installed shared and component CSS files are imported once.
If interaction differs, preserve this contract: Native link behavior.
If assistive output differs, preserve this semantic foundation: A labelled nav containing an ordered list and aria-current page.
If dark, RTL, or reduced-motion behavior is missing, verify the nearest theme, direction, and media-query boundaries rather than adding page-local overrides.

Live product source

The Component Lab exercises real source across default, focus, disabled, responsive, dark, reduced-motion, and RTL contexts.

Interactive inspection

Resize the canvas, switch its theme, or reverse its reading direction without changing the rest of the page.

Editable source

Loading editable source…