Skip to main content Skip to docs navigation

Plugins - Custom Date Formats

On this page

This plugin provides the ability to specify the picker's format. The picker's options can be set via then localization settings.

Use the boxes below to set a format string and the locale of the sample picker and click "Change" to update the options.

tempusDominus.extend(window.tempusDominus.plugins.customDateFormat);
//or
import customDateFormat from 'tempusDominus/plugins/customDateFormat'
tempusDominus.extend(customDateFormat);

//example picker
const datetimepicker1 = new tempusDominus.TempusDominus(document.getElementById('datetimepicker1'),
  localization: {
  locale: 'pt-BR',
  format: 'dd/MM/yyyy HH:mm',
});

    

Format Tokens

The custom date format plugin supports the following tokens. Given 2022-07-04T15:13:29.474Z

Token Description Result
yy 2 digit year 22
yyyy 4 digit year 2022
M 1-2 digit month, e.g. 1...12 7
MM 2 digit month 07
MMM Short Month Jul
MMMM Full Month July
d 1-2 digit day, e.g. 1...31 4
dd 2 digit day 04
ddd Short Weekday Mon
dddd Full Weekday Monday
H 1-2 digit hour (24 hour) 13
HH 2 digit hour (24 hour) 13
h 1-2 digit hour (12 hour) 1 (PM)
hh 2 digit hour (12 hour) 01 (PM)
m 1-2 digit minute, e.g. 0...59 29
mm 2 digit minute, e.g. 0...5 29
s 1-2 digit second, e.g. 0...59 47
ss 2 digit second, e.g. 0...59 47
T Meridiem PM