Breadcrumb

            
<!-- breadcrumb -->
<nav class="breadcrumb py-2 px-4 rounded shadow-inset-fixed text-sm bg-primary-100 border border-primary-200 dark:bg-primary-900 dark:border-primary-950">
  <ol class="list-none p-0 inline-flex">
    <li class="flex items-center">
      <a href="/" class="hover:underline">Home</a>
    </li>
    <li class="flex items-center">
      <span class="mx-2">›</span>
      <a href="#" class="hover:underline">Category</a>
    </li>
    <li class="flex items-center">
      <span class="mx-2">›</span>
      <a href="#" class="hover:underline">Product</a>
    </li>
    <li class="flex items-center">
      <span class="mx-2">›</span>
      <a href="#" class="hover:underline">Detail</a>
    </li>
  </ol>
</nav>