Basic

Use an ordered or unordered list with linked list items to create a minimally styled breadcrumb. Use our utilities to add additional styles as desired.

Line Separator

Add .breadcrumb-lineto enable line separator style for a breadcrumb.

Dot Separator

Add .breadcrumb-dot enable line separator style for a breadcrumb.

Without Separator

Add .breadcrumb-separatorless to remove the separator.

Colored Breadcrumb

use class .breadcrumb-colored .bg-primary

layout
Layout
Choose your layout
Vertical
Horizontal
Two Column
RTL Mode
Change Language Direction.
Color Scheme
Choose Light or Dark Scheme.
Blue
Light
Dark
Orange
Brink Pink
Green
Layout Width
Choose Fluid or Boxed layout.
Fluid
Boxed
Layout Position
Choose Fixed or Scrollable Layout Position.
Topbar Color
Choose Light or Dark Topbar Color.
Light
Dark