<nav aria-label="breadcrumb">
    <ol class="breadcrumb">
      <li class="breadcrumb-item active" aria-current="page">Home </li>
    </ol>
  </nav>

  <nav aria-label="breadcrumb">
    <ol class="breadcrumb">
      <li class="breadcrumb-item">  <a href="#">Home  </a>  </li>
      <li class="breadcrumb-item active" aria-current="page">Library  </li>
    </ol>
  </nav>

  <nav aria-label="breadcrumb">
    <ol class="breadcrumb">
      <li class="breadcrumb-item">  <a href="#">Home  </a>  </li>
      <li class="breadcrumb-item">  <a href="#">Library </a> </li>
      <li class="breadcrumb-item active" aria-current="page">Data </li>
    </ol>
  </nav>

                

  <nav aria-label="breadcrumb">
    <ol class="breadcrumb breadcrumb-inverse">
      <li class="breadcrumb-item active" aria-current="page">Home</li>
    </ol>
  </nav>

  <nav aria-label="breadcrumb">
    <ol class="breadcrumb breadcrumb-inverse">
      <li class="breadcrumb-item"><a href="#">Home</a></li>
      <li class="breadcrumb-item active" aria-current="page">Library</li>
    </ol>
  </nav>

  <nav aria-label="breadcrumb">
    <ol class="breadcrumb breadcrumb-inverse">
      <li class="breadcrumb-item"><a href="#">Home</a></li>
      <li class="breadcrumb-item"><a href="#">Library</a></li>
      <li class="breadcrumb-item active" aria-current="page">Data</li>
    </ol>
  </nav>

                

<!-- Breadcrumb Primary -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-primary">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb Primary -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-secondary">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb success -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-success">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb danger -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-danger">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb warning -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-warning">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb info -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-info">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb light -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-light">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>

<!-- Breadcrumb dark -->
<nav aria-label="breadcrumb">
  <ol class="breadcrumb breadcrumb-dark">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item"><a href="#">Library</a></li>
    <li class="breadcrumb-item active" aria-current="page">Data</li>
  </ol>
</nav>