Update v4.2 - New components, 10+ framework guides, and quality improvements. Visit Changelog

Tailwind CSS Breadcrumb

Build Tailwind CSS breadcrumb components with chevron or slash separators, icons, bordered trails, and more-button dropdowns for hidden levels.

Chevron separators

Use chevron separators for the default breadcrumb pattern.

Slash separators

Swap the separators for slashes to create a lighter breadcrumb style.

Breadcrumbs with icons

Add icons to breadcrumb items for extra visual context.

Bordered breadcrumb

Add top and bottom borders to frame the breadcrumb trail.

Static more button

Use a static more button to indicate hidden breadcrumb levels without expanding them.

More button with dropdown

Requires JS

Note that this component requires the use of our Dropdown plugin, else you can skip this message if you are already using Preline UI as a package.

Use a more button with a dropdown to reveal hidden breadcrumb levels on demand.

© 2026 Preline Labs.