Breadcrumbs

A navigation trail using <nav aria-label="Breadcrumb"> and <ol> styled with @utility breadcrumb-* classes.

Usage

breadcrumbs.html

<nav aria-label="Breadcrumb">
  <ol class="breadcrumbs">
    <li>
      <a href="#" class="breadcrumb-link">Home</a>
    </li>
    <li aria-hidden="true">/</li>
    <li>
      <a href="#" class="breadcrumb-link">Design System</a>
    </li>
    <li aria-hidden="true">/</li>
    <li aria-current="page" class="breadcrumb-active">
      Breadcrumbs
    </li>
  </ol>
</nav>