Datepicker

Pages

Users

Al Pacino

alpacino@left4code.com

Kevin Spacey

kevinspacey@left4code.com

Kevin Spacey

kevinspacey@left4code.com

Denzel Washington

denzelwashington@left4code.com

Products

Nike Air Max 270

Sport & Outdoor

Samsung Galaxy S20 Ultra

Notifications

Al Pacino

03:20 PM

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 20

Kevin Spacey

01:10 PM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Kevin Spacey

05:09 AM

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomi

Denzel Washington

01:10 PM

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500

Morgan Freeman

06:05 AM

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500

Basic Date Picker

Show example code

  HTMLOpenTaginput class="datepicker input w-56 border block mx-auto" data-single-mode="true"HTMLCloseTag

Input Group

Show example code

  HTMLOpenTagdiv class="relative w-56 mx-auto"HTMLCloseTag HTMLOpenTagdiv class="absolute rounded-l w-10 h-full flex items-center justify-center bg-gray-100 border text-gray-600 dark:bg-dark-1 dark:border-dark-4"HTMLCloseTag HTMLOpenTagi data-feather="calendar" class="w-4 h-4"HTMLCloseTagHTMLOpenTag/iHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTaginput type="text" class="datepicker input pl-12 border" data-single-mode="true"HTMLCloseTag HTMLOpenTag/divHTMLCloseTag

Date Range Picker

Show example code

  HTMLOpenTaginput data-daterange="true" class="datepicker input w-56 border block mx-auto"HTMLCloseTag

Modal Date Picker

Show example code

Show Modal

  HTMLOpenTagdiv class="text-center"HTMLCloseTag HTMLOpenTaga href="javascript:;" data-toggle="modal" data-target="#datepicker-modal-preview" class="button inline-block bg-theme-1 text-white"HTMLCloseTagShow ModalHTMLOpenTag/aHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="modal" id="datepicker-modal-preview"HTMLCloseTag HTMLOpenTagdiv class="modal__content"HTMLCloseTag HTMLOpenTagdiv class="flex items-center px-5 py-5 sm:py-3 border-b border-gray-200 dark:border-dark-5"HTMLCloseTag HTMLOpenTagh2 class="font-medium text-base mr-auto"HTMLCloseTagFilter by DateHTMLOpenTag/h2HTMLCloseTag HTMLOpenTagbutton class="button border items-center text-gray-700 hidden sm:flex"HTMLCloseTag HTMLOpenTagi data-feather="file" class="w-4 h-4 mr-2"HTMLCloseTagHTMLOpenTag/iHTMLCloseTag Download Docs HTMLOpenTag/buttonHTMLCloseTag HTMLOpenTagdiv class="dropdown sm:hidden"HTMLCloseTag HTMLOpenTaga class="dropdown-toggle w-5 h-5 block" href="javascript:;"HTMLCloseTag HTMLOpenTagi data-feather="more-horizontal" class="w-5 h-5 text-gray-700 dark:text-gray-600"HTMLCloseTagHTMLOpenTag/iHTMLCloseTag HTMLOpenTag/aHTMLCloseTag HTMLOpenTagdiv class="dropdown-box w-40"HTMLCloseTag HTMLOpenTagdiv class="dropdown-box__content box dark:bg-dark-1 p-2"HTMLCloseTag HTMLOpenTaga href="javascript:;" class="flex items-center p-2 transition duration-300 ease-in-out bg-white dark:bg-dark-1 hover:bg-gray-200 dark:hover:bg-dark-2 rounded-md"HTMLCloseTag HTMLOpenTagi data-feather="file" class="w-4 h-4 mr-2"HTMLCloseTagHTMLOpenTag/iHTMLCloseTag Download Docs HTMLOpenTag/aHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="p-5 grid grid-cols-12 gap-4 row-gap-3"HTMLCloseTag HTMLOpenTagdiv class="col-span-12 sm:col-span-6"HTMLCloseTag HTMLOpenTaglabelHTMLCloseTagFromHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput class="datepicker input w-full border mt-2" data-single-mode="true"HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="col-span-12 sm:col-span-6"HTMLCloseTag HTMLOpenTaglabelHTMLCloseTagToHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput class="datepicker input w-full border mt-2" data-single-mode="true"HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class="px-5 py-3 text-right border-t border-gray-200 dark:border-dark-5"HTMLCloseTag HTMLOpenTagbutton type="button" data-dismiss="modal" class="button w-20 border text-gray-700 dark:border-dark-5 dark:text-gray-300 mr-1"HTMLCloseTagCancelHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTagbutton type="button" class="button w-20 bg-theme-1 text-white"HTMLCloseTagSubmitHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTag/divHTMLCloseTag