Breadcrumb

Displays the hierarchical navigation path of a page, making it easier for the user to return to previous levels of the site.

Basic Usage

1. Home
2. Documentos
3. Agregar

<div class="breadcrumbs">
  <ol>
    <li>
      <a href="#"><span>Home</span></a>
    </li>
    <li>
      <a href="#"><span>Documentos</span></a>
    </li>
    <li><span>Agregar</span></li>
  </ol>
</div>

Icons

Displays icons in the breadcrumb items.

Preview

2. Documentos
3. Agregar

Code

<div class="breadcrumbs">
  <ol>
    <li>
      <a href="#"><iconify-icon class="icon" icon="mdi:home"></iconify-icon></a>
    </li>
    <li>
      <a href="#">
        <iconify-icon class="icon" icon="mdi:files"></iconify-icon>
        <span>Documentos</span>
      </a>
    </li>
    <li>
      <iconify-icon class="icon" icon="mdi:add-bold"></iconify-icon>
      <span>Agregar</span>
    </li>
  </ol>
</div>