UI MarCom 3

Date-Time-Picker Stable Dark theme

A calendar for date inputs.

The Date-Time-Picker is a component that adds a calendar to date inputs. It lets the user pick dates or date ranges, for example, in forms or filters. Dates can be selected using the built-in-calendar that opens when the user focuses in the Date-Time-Picker or clicks on the calendar icon. (not shown)

The Date-Time-Picker is actually separated into two components.

  • Datepicker input
  • Timepicker input

The old version from UI MarCom 2 is based on a jQuery plugin and also supports an inline view and selection of date ranges as seen in the code samples.


Date input with applied light and dark theming


Time input with applied light and dark theming

Inline Datepicker

Inline Timepicker

Date range picker