Lightweight, dependency free, fast, customizable datepicker written in pure JavaScript. ![air datepicker image](

Downloads in past


2,2892483.3.54 months ago7 years agoMinified + gzip package size for air-datepicker in KB


:tada: New version released! :tada:
Air Datepicker
Lightweight, dependency-free, fast, customizable datepicker written in pure JavaScript. Works in all modern browsers which supports native css variables. air datepicker image


``` npm i air-datepicker ```


```javascript import AirDatepicker from 'air-datepicker' import 'air-datepicker/air-datepicker.css' new AirDatepicker('#el' , options); ```

Demo and docs

Recent updates


  • added handling of optional chaining operator in dist package #518


  • recreate global container if it was removed from DOM #516


  • fixed time format in timepicker body #512


  • fixed day period value, when selecting date while datepicker is not active, #510
  • fixed German locale, #511



  • new feature that allow you to add custom attributes via onRenderCell #502, read docs
  • fixed selecting cell when using custom html with onRenderCell option #502



  • added onClickDayName option, #459
  • added silent param to clear method, #477
  • fixed error when trying to call update method with view parameter on hidden calendar, #476
  • fixed styles issue with time sliders, #489
  • fixed English docs description, #490
  • fixed typings for formatDate method, #491

Version 3.0.0 highlights

It is been a while since the last release, a lot of work has been done, and I'm glad to finally present a new version of Air Datepicker. The main goal was to remove jQuery dependency, and I'm happy to announce that Air Datepicker is no longer need any dependency, hurray! :partyingface: Now it's written in ES6, uses native css variables for easy customization, and it's all built with webpack. Soooo, here is the full list of changes:
  • no more jQuery
  • improve rendering process - remove redundant cell render when selecting date, which gave a large speed boost compared to the old version
  • TypeScript support
  • added selectedDates option, to be able to select dates from the start
  • added a possibility to create custom buttons
  • now one could change selected range by dragging dates
  • added container option which allows you to place datepicker in a custom element
  • navTitles can receive a function and could render dynamically
  • dateFormat now can receive a function
  • onSelect and onRenderCell callbacks are now receive a single object as an argument instead of multiple parameters
  • selectDate now receives second parameter with options
  • onChangeMonth, onChangeYear, onChangeDecades are replaced with single option onChangeViewDate
  • localization now must be provided as an object instead of string as it was before


  • To run project run npm i, then npm run dev:serve.
  • If you want to report a bug, please provide steps and code to reproduce it or create a live example. You could use this template for creating sandbox
  • If you have a question please ask it on StackOverflow with tag air-datepicker
  • If you have a proposal or PR please submit it to the main branch - please follow code style according to .eslint configuration.
Also make sure that your effort is aligned with project roadmap - my goal is to keep datepicker clean and lightweight (under 15kb) without overcomplications or narrowly focused features Thank you! :blush:


Air Datepicker is MIT licensed.