The breadcrumb is a standard navigation element that helps the user identify their site location.

Technical Details

  • It is an ordered list <ol> element.
  • It uses aria-current="page" to mark the current position.


As you see, it uses custom color values from the $colors map.

For this component there are some extra variables at the config page like you see it below.

$colors: (
  'breadcrumb': (
    'separator': hsl(0deg 0% 80%),