Navigieren auf digital.sbb.ch

Beta

Switch

1. Was macht das Element?

  • Dient zum Ein- oder Ausschalten von einzelnen Einstellungsoptionen.

2. Wann soll das Element eingesetzt werden?

  • Wenn Einstellungsoptionen ein- oder ausgeschaltet werden müssen.

3. Regeln

  • Darf nur zum Ein- oder Ausschalten einer Funktion verwendet werden.
  • Es sind keine Labels «ein» und «aus» zu nutzen.
  • Die Einstellungsoption muss klar benannt werden mittels einem Label links.

4. Ausprägungen und Zustände

Das Element hat folgende Zustände:

  • Selected
  • Unselected
  • Disabled Selected
  • Disabled Unselected
  • Loading
  • Error (default / retry / reloading / button)

Das Element hat folgende Ausprägungen:

  • Switch
    • Selected / Unselected
  • Switch-Item
    • without icon / with icon
    • listed / boxed
    • without subtext / with subtext
    • without link / with Link

4.1 Switch

Darstellung des Switch
Darstellung des Switch

4.2 Switch-Item

4.2.1 Liste

Darstellung des Switch
Darstellung des Switch

4.2.2 Liste, mit Icon

Darstellung des Switch
Darstellung des Switch

4.2.3 Liste, mit Subtext

Darstellung des Switch
Darstellung des Switch

4.2.4 Liste, mit Link

Darstellung des Switch
Darstellung des Switch

4.2.5 Boxed

Darstellung des Switch
Darstellung des Switch

4.2.6 Boxed, mit Icon

Darstellung des Switch
Darstellung des Switch

4.2.7 Boxed, mit Subtext

Darstellung des Switch
Darstellung des Switch

4.2.8 Boxed, mit Link

Darstellung des Switch
Darstellung des Switch

Design Spezifikation

Figma-Link