Digital Clock

Scrollable time list for selecting time-of-day, bound to OrbitalDateTime.

DigitalClock renders a vertical list of time slots at appearance.time_step increments. Values anchor to appearance.reference_date or the nearest DatetimeLocale default. Clock surfaces are optional product features documented via DatePickerFeatures::CLOCK_VIEWS — there is no runtime license check.

  • Compact time selection in picker panels
  • Alternatives to scroll-column TimePicker surfaces
  • Bind Option<OrbitalDateTime> via DigitalClockBind.
  • Set appearance.time_step for list increment (default 30 minutes).
  • Wrap preview examples in a native element with data-testid.
Digital list

Scroll a 30-minute slot list; the readout above shows your selection (preview also prints unix for E2E).

Select a time
  • 12:00 AM
  • 12:30 AM
  • 1:00 AM
  • 1:30 AM
  • 2:00 AM
  • 2:30 AM
  • 3:00 AM
  • 3:30 AM
  • 4:00 AM
  • 4:30 AM
  • 5:00 AM
  • 5:30 AM
  • 6:00 AM
  • 6:30 AM
  • 7:00 AM
  • 7:30 AM
  • 8:00 AM
  • 8:30 AM
  • 9:00 AM
  • 9:30 AM
  • 10:00 AM
  • 10:30 AM
  • 11:00 AM
  • 11:30 AM
  • 12:00 PM
  • 12:30 PM
  • 1:00 PM
  • 1:30 PM
  • 2:00 PM
  • 2:30 PM
  • 3:00 PM
  • 3:30 PM
  • 4:00 PM
  • 4:30 PM
  • 5:00 PM
  • 5:30 PM
  • 6:00 PM
  • 6:30 PM
  • 7:00 PM
  • 7:30 PM
  • 8:00 PM
  • 8:30 PM
  • 9:00 PM
  • 9:30 PM
  • 10:00 PM
  • 10:30 PM
  • 11:00 PM
  • 11:30 PM
none
none
List selection

Click a time slot to commit the bound value.

Select a time
  • 12:00 AM
  • 12:30 AM
  • 1:00 AM
  • 1:30 AM
  • 2:00 AM
  • 2:30 AM
  • 3:00 AM
  • 3:30 AM
  • 4:00 AM
  • 4:30 AM
  • 5:00 AM
  • 5:30 AM
  • 6:00 AM
  • 6:30 AM
  • 7:00 AM
  • 7:30 AM
  • 8:00 AM
  • 8:30 AM
  • 9:00 AM
  • 9:30 AM
  • 10:00 AM
  • 10:30 AM
  • 11:00 AM
  • 11:30 AM
  • 12:00 PM
  • 12:30 PM
  • 1:00 PM
  • 1:30 PM
  • 2:00 PM
  • 2:30 PM
  • 3:00 PM
  • 3:30 PM
  • 4:00 PM
  • 4:30 PM
  • 5:00 PM
  • 5:30 PM
  • 6:00 PM
  • 6:30 PM
  • 7:00 PM
  • 7:30 PM
  • 8:00 PM
  • 8:30 PM
  • 9:00 PM
  • 9:30 PM
  • 10:00 PM
  • 10:30 PM
  • 11:00 PM
  • 11:30 PM
none
none
Fifteen-minute steps

List items appear every 15 minutes.

Select a time
  • 12:00 AM
  • 12:15 AM
  • 12:30 AM
  • 12:45 AM
  • 1:00 AM
  • 1:15 AM
  • 1:30 AM
  • 1:45 AM
  • 2:00 AM
  • 2:15 AM
  • 2:30 AM
  • 2:45 AM
  • 3:00 AM
  • 3:15 AM
  • 3:30 AM
  • 3:45 AM
  • 4:00 AM
  • 4:15 AM
  • 4:30 AM
  • 4:45 AM
  • 5:00 AM
  • 5:15 AM
  • 5:30 AM
  • 5:45 AM
  • 6:00 AM
  • 6:15 AM
  • 6:30 AM
  • 6:45 AM
  • 7:00 AM
  • 7:15 AM
  • 7:30 AM
  • 7:45 AM
  • 8:00 AM
  • 8:15 AM
  • 8:30 AM
  • 8:45 AM
  • 9:00 AM
  • 9:15 AM
  • 9:30 AM
  • 9:45 AM
  • 10:00 AM
  • 10:15 AM
  • 10:30 AM
  • 10:45 AM
  • 11:00 AM
  • 11:15 AM
  • 11:30 AM
  • 11:45 AM
  • 12:00 PM
  • 12:15 PM
  • 12:30 PM
  • 12:45 PM
  • 1:00 PM
  • 1:15 PM
  • 1:30 PM
  • 1:45 PM
  • 2:00 PM
  • 2:15 PM
  • 2:30 PM
  • 2:45 PM
  • 3:00 PM
  • 3:15 PM
  • 3:30 PM
  • 3:45 PM
  • 4:00 PM
  • 4:15 PM
  • 4:30 PM
  • 4:45 PM
  • 5:00 PM
  • 5:15 PM
  • 5:30 PM
  • 5:45 PM
  • 6:00 PM
  • 6:15 PM
  • 6:30 PM
  • 6:45 PM
  • 7:00 PM
  • 7:15 PM
  • 7:30 PM
  • 7:45 PM
  • 8:00 PM
  • 8:15 PM
  • 8:30 PM
  • 8:45 PM
  • 9:00 PM
  • 9:15 PM
  • 9:30 PM
  • 9:45 PM
  • 10:00 PM
  • 10:15 PM
  • 10:30 PM
  • 10:45 PM
  • 11:00 PM
  • 11:15 PM
  • 11:30 PM
  • 11:45 PM
24-hour labels

Slots display 24-hour formatted labels.

Select a time
  • 00:00
  • 00:30
  • 01:00
  • 01:30
  • 02:00
  • 02:30
  • 03:00
  • 03:30
  • 04:00
  • 04:30
  • 05:00
  • 05:30
  • 06:00
  • 06:30
  • 07:00
  • 07:30
  • 08:00
  • 08:30
  • 09:00
  • 09:30
  • 10:00
  • 10:30
  • 11:00
  • 11:30
  • 12:00
  • 12:30
  • 13:00
  • 13:30
  • 14:00
  • 14:30
  • 15:00
  • 15:30
  • 16:00
  • 16:30
  • 17:00
  • 17:30
  • 18:00
  • 18:30
  • 19:00
  • 19:30
  • 20:00
  • 20:30
  • 21:00
  • 21:30
  • 22:00
  • 22:30
  • 23:00
  • 23:30