flatpickr: адаптивный календарь, 8 тем оформления, без зависимостей

Эта библиотека проста в использовании, имеет удобный API, небольшой вес, множество локализаций. Далее мы разберём пример её использования.

Использование

Вы можете устанавливать через bower или npm, для этого примера мы будем делать проще:

<link rel="stylesheet" href="https://unpkg.com/flatpickr/dist/flatpickr.min.css">
<script src="https://unpkg.com/flatpickr"></script>

Теперь укажем для какого инпута нам нужно использовать flatpickr:

flatpickr(".date", {});

Добавим на страницу наш инпут:

<input class="date" type="text" placeholder="Выберите дату">

Результатом будет:

Более подробно смотрим тут — flatpickr