Breadcrumb

Component #1

Personal info

<!-- Breadcrumb Section -->
<div class="bg-dark" style="background-image: url(../assets/svg/components/abstract-shapes-20.svg);">
  <div class="container space-1 space-lg-2">
    <div class="row align-items-center">
      <div class="col">
        <div class="d-none d-lg-block">
          <h1 class="h2 text-white">Personal info</h1>
        </div>

        <!-- Breadcrumb -->
        <ol class="breadcrumb breadcrumb-light breadcrumb-no-gutter mb-0">
          <li class="breadcrumb-item">Account</li>
          <li class="breadcrumb-item active" aria-current="page">Personal info</li>
        </ol>
        <!-- End Breadcrumb -->
      </div>

      <div class="col-auto">
        <div class="d-none d-lg-block">
          <a class="btn btn-soft-light" href="#">Log out</a>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- End Breadcrumb Section -->

Component #2

<!-- Breadcrumb Section -->
<div class="container py-3">
  <div class="row align-items-lg-center">
    <div class="col-lg mb-2 mb-lg-0">
      <!-- Breadcrumb -->
      <nav aria-label="breadcrumb">
        <ol class="breadcrumb breadcrumb-no-gutter font-size-1 mb-0">
          <li class="breadcrumb-item"><a href="#">For Sale</a></li>
          <li class="breadcrumb-item"><a href="#">England</a></li>
          <li class="breadcrumb-item"><a href="#">London</a></li>
          <li class="breadcrumb-item"><a href="#">Studio</a></li>
          <li class="breadcrumb-item active" aria-current="page">470 Lucy Forks, Patriciafurt, YC7B</li>
        </ol>
      </nav>
      <!-- End Breadcrumb -->
    </div>

    <div class="col-lg-auto">
      <a class="btn btn-sm btn-ghost-secondary" href="javascript:;">
        <i class="far fa-heart mr-2"></i> Save
      </a>

      <a class="btn btn-sm btn-ghost-secondary" href="javascript:;">
        <i class="fas fa-share-alt mr-2"></i> Share
      </a>
    </div>
  </div>
  <!-- End Row -->
</div>
<!-- End Breadcrumb Section -->