Navigieren auf digital.sbb.ch

Beta

Typography

1. What does the element do?

  • It defines all permitted fonts in the SBB Mobile context.

2. When should the element be used?

  • For the design of all elements, modules, components and pages.

3. Regeln

  • None

4. Variants

4.1 Header

Image of the header style

Size

4.2 Headline

Black

Image of the headline style, black

Size

White

Image of the headline style, white

Size

4.3 Title

4.3.1 Default

Black
Image of the title style, default, black

Size

Metal
Image of the title style, default, metal

Size

4.3.2 Module

Image of the title style, modul

Size

4.4 Subtitle

Black

Image of the subtitle style, black

Size

Metal
Image of the subtitle style, metal

Size

4.5 Copy

Black

Image of the copy style, black

Size

White

Image of the copy style, White

Size

4.6 Body

Black

Image of the body style, Black

Size

Metal

Image of the copy style, Metal

Size

Red

Image of the copy style, Red

Size

4.7 Legend

4.7.1 Normal

Black
Image of the legend style, normal, black

Size

Metal
Image of the legend style, normal, metal

Size

Red
Image of the legend style, normal, red

Size

White
Image of the legend style, normal, white

Size

4.7.2 Small

Image of the legend style, small

Size

4.8 Link

Default

Image of the link style, default

Size

Pressed

Image of the link style, pressed

Size

4.9 Formular

4.9.1 Primary button

Default
Image of the primary button style, Default

Size

Disabled
Image of the primary button style, Disabled

Size

4.9.2 Secondary button

Default
Image of the secondary button style, Default

Size

Disabled
Image of the secondary button style, Disabled

Size

Pressed
Image of the secondary button style, Pressed

Size

4.9.3 Frameless primary button

Normal
Default
Image of the frameless primay button style, normal, default

Size

Pressed
Image of the frameless primay button style, normal, pressed

Size

Small
Default
Image of the frameless primay button style, small, default

Size

Pressed
Image of the frameless primay button style, small, pressed

Size

4.9.4 Frameless secondary button

Normal
Default
Image of the frameless secondary button style, normal, default

Size

Pressed
Image of the frameless secondary button style, normal, pressed

Size

Small
Default
Image of the frameless secondary button style, small, default

Size

Pressed
Image of the frameless secondary button style, small, pressed

Size

4.9.5 Button segmented

Checked

Size

Unchecked

Size

4.9.6 Checkbox

Default
Image of the checkbox style, default

Size

Disabled
Image of the checkbox style, disabled

Size

4.9.7 Radio

Default
Image of the radio style, default

Size

Disabled
Image of the radio style, disabled

Size

4.9.8 Select

Title
Image of the radio style, select

Size

Value
Image of the radio style, value

Size

4.9.9 Input

Value
Default
Image of the input style, value, default

Size

Disabled
Image of the input style, Value, disabled

Size

Label Default
Image of the input style, value, label default

Size

Label Small
Image of the Input style, value, label small

Size

Error
Image of the input style, value, error

Size

Daten konnten nicht geladen werden.
https://raw.githubusercontent.com/sbb-design-systems/design-system-mobile-documentation/master/documentation/basics/typography/typography-en.md