Navigieren auf digital.sbb.ch

Breadcrumb

1. What does the component do?

  • It shows the navigation hierarchy of the current page.

2. When should the component be used?

  • On any page where the user should be able to quickly navigate to the parent page.

3. Rules

  • The breadcrumb is always positioned directly beneath the header.
  • The breadcrumb can be multi-line for long entries.
  • All levels are always shown.

4. Variants and statuses

The component has the following statuses:

  • Default
  • Hover

4.1 Standard

Image of the breadcrumb component

Design specification

Code specification