Navigieren auf digital.sbb.ch

Beta

Link

1. What does the component do?

Links create connections between information or pages.

2. When should the component be used?

When jumping from one page to another (internal or external) or to a lightbox.

3. Rules

  • There is no visual distinction between internal and external links.
  • Hover and on-click have the same visual interaction behaviour.
  • Links can be created in texts, icons and images.
  • Text links in parts of words are not allowed.

4. Variants and statuses

The component has the following statuses:

  • Default
  • Hover
  • On-Click

4.1 Standard

Image of the link component in the standard variant

Design specification

Code specification

The standard link is not an independent component but is instead defined directly in the Typografie area.

4.2 Lead link

Image of the link component for use in a lead text

Design specification

Code specification

4.3 After paragraphs

Image of the link component for use after a paragraph

Design specification

Code specification

4.4 After form elements

Image of the link component for use after form elements

Design specification

Code specification

4.5 In menus

Image of the link component in menus

Design specification

Code specification

4.6 Social media

Image of the link component to jump to a social media channel

Design specification

Code specification