Breadcrumb

A horizontal path showing the user's position in a site hierarchy. Uses a <nav> wrapper with an ordered list inside. Separators between items are auto-generated via __item::before.

Default breadcrumb

<nav class="ln-breadcrumb" aria-label="Breadcrumb">
  <ol class="ln-breadcrumb__list">
    <li class="ln-breadcrumb__item">
      <a class="ln-breadcrumb__link" href="#">Home</a>
    </li>
    <li class="ln-breadcrumb__item">
      <a class="ln-breadcrumb__link" href="#">Products</a>
    </li>
    <li class="ln-breadcrumb__item">
      <span class="ln-breadcrumb__current">Running Shoes</span>
    </li>
  </ol>
</nav>

Small breadcrumb

<nav class="ln-breadcrumb ln-breadcrumb--sm" aria-label="Breadcrumb">
  <ol class="ln-breadcrumb__list">
    <li class="ln-breadcrumb__item">
      <a class="ln-breadcrumb__link" href="#">Dashboard</a>
    </li>
    <li class="ln-breadcrumb__item">
      <a class="ln-breadcrumb__link" href="#">Settings</a>
    </li>
    <li class="ln-breadcrumb__item">
      <span class="ln-breadcrumb__current">Profile</span>
    </li>
  </ol>
</nav>

Reference

Class	Description	Responsive
`.ln-breadcrumb`	Breadcrumb container	No
`.ln-breadcrumb__list`	Ordered list of items	No
`.ln-breadcrumb__item`	Individual breadcrumb item	No
`.ln-breadcrumb__link`	Clickable breadcrumb link	No
`.ln-breadcrumb__current`	Current page label (non-link)	No
`.ln-breadcrumb--sm`	Small size variant	No
`.ln-breadcrumb--truncate`	Collapse middle items for long paths	No