Breadcrumb
Indicate the current page’s location within a navigational hierarchy.
<!-- Basic example -->
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Products list</a></li>
<li class="breadcrumb-item active" aria-current="page">Single product</li>
</ol>
</nav>
<!-- Home icon -->
<nav aria-label="breadcrumb">
<ol class="breadcrumb align-items-center">
<li class="breadcrumb-item">
<a href="#" class="d-flex" aria-label="Home">
<i class="ci-home fs-base"></i>
</a>
</li>
<li class="breadcrumb-item"><a href="#">Products list</a></li>
<li class="breadcrumb-item active" aria-current="page">Single product</li>
</ol>
</nav>
<!-- Home icon + text -->
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="#" class="d-flex align-items-center">
<i class="ci-home fs-base me-2"></i>
Home
</a>
</li>
<li class="breadcrumb-item"><a href="#">Products list</a></li>
<li class="breadcrumb-item active" aria-current="page">Single product</li>
</ol>
</nav>