Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?


Failed to load latest commit information.

🎉 New version released! 🎉

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


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
  • added Indonesian locale, thanks to BariqDharmawan, in #517


  • recreate global container if it was removed from DOM #516
  • added Greek locale, thanks to sonole, in #515


  • 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
  • added Swedish locale, thanks to naton #207
  • 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! 🥳

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
  • date format tokens now use Unicode Technical Standard
  • 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! 😊


Air Datepicker is MIT licensed.