Navigieren auf digital.sbb.ch

Picker

1. What does the element do?

  • It is used for the entry of a value, date, time or combination of them.

2. When should the element be used?

  • Whenever a date and/or time value is required from the user.

3. Rules

  • The value information is always single-line.
  • Optional entries include the text ‘(optional)’ behind the label. For short fields, the text ‘(optional)’ can be abbreviated to ‘(opt.)’.
  • The picker is opened by clicking on the entry field. A maximum of three selection wheels are available within the picker.

4. Variants and statuses

  • Type: Date-Time / Date / Time / Timerange / Value
  • Display: Default / Boxed
  • Label: optional

4.1 Date-Time

Darstellung Picker, Date-Time
Darstellung Picker, Date-Time

4.2 Date

Darstellung Picker, Date
Darstellung Picker, Date

4.3 Time

Darstellung Picker, Time
Darstellung Picker, Time

4.4 Timerange

Darstellung Picker, Timerange
Darstellung Picker, Timerange

4.5 Value

Darstellung Picker, Value
Darstellung Picker, Value

Design Specification

Figma-Link