Breadcrumbs

The breadcrumbs pattern indicates the current page's location within a navigational hierarchy in relation to the website's homepage.

Rules for the breadcrumbs

  • Must not be used on any page that uses the hero banner pattern such as the University's homepage.
  • Must not be used on long-form pages.
  • Must be used at the top of content pages, sitting immediately beneath the navigation bar and above the page content.

Options available

Breadcrumbs

Example
Code

Breadcrumbs (old version) - deprecated

This option is no longer supported

This implementation is now deprecated and will be removed in a future release. This does not include the breadcrumbs--wrapper class which is required to add collapsible margins.

Example
Code