Collection of free Bootstrap datepicker and timepicker code examples.

Related Articles

  1. jQuery Datepickers and Timepickers

Author

  • Omkar Bailkeri

Made with

  • HTML / CSS / JS

About a code

Bootstrap 4 Blue Themed Date Picker

Bootstrap 4 blue themed date picker with date range and week number.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, bootstrap.js, jquery.js

Bootstrap version: 4.3.1

Author

  • Omkar Bailkeri

Made with

  • HTML / CSS / JS

About a code

Table with Custom Time

Bootstrap 4 business hours table with custom time.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, bootstrap.js, jquery.js

Bootstrap version: 4.3.1

Author

  • Omkar Bailkeri

Made with

  • HTML / CSS / JS

About a code

Bootstrap 4 Dark Themed Date and Time Picker

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, bootstrap.js, jquery.js

Bootstrap version: 4.3.1

Author

  • Omkar Bailkeri

Made with

  • HTML / CSS / JS

About a code

Bootstrap 4 Date Range Datepicker

Bootstrap 4 date range datepicker with two months shown.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, daterangepicker.css, bootstrap.js, jquery.js, moment.js, daterangepicker.js

Bootstrap version: 4.3.1

Author

  • Omkar Bailkeri

Made with

  • HTML / CSS / JS

About a code

Bootstrap 4 Green Themed Datepicker

Bootstrap 4 green themed datepicker with date range.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, bootstrap-datepicker.css, font-awesome.css, bootstrap.js, jquery.js, bootstrap-datepicker.js

Bootstrap version: 4.4.1

Demo image: Bootstrap Datepicker

Author

  • Ondrej

Made with

  • HTML / CSS / JS

About a code

Bootstrap Datepicker

Create a nicely styled reservation form using Bootstrap 4 and Bootstrap datepicker.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, bootstrap-datepicker.css, bootstrap.js, jquery.js, bootstrap-datepicker.js

Bootstrap version: 4.3.1

Author

  • John Fink

Made with

  • HTML (Pug) / CSS (SCSS) / JS

About a code

Bootstrap Date/Time Picker

Custom bootstrap styling for Eonasdan's DateTimePicker.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, bootstrap-datetimepicker.css, bootstrap.js, jquery.js, moment.js, bootstrap-datetimepicker.js

Bootstrap version: 4.1.3

Author

  • Ryan Mulligan

Made with

  • HTML (Pug) / CSS (SCSS) / JS

About a code

Bootstrap Datepicker

Using a Bootstrap datepicker and the getDate method to add a second string with different date formatting.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap-datepicker.css, bootstrap-datepicker.js, jquery.js, jquery-dateFormat.js

Demo image: AB Datepicker

Author

  • Jacques Archim├Ęde

Made with

  • HTML / CSS / JS

About a code

AB Datepicker

An accessible and Bootstrap compatible datepicker.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Bootstrap version: 3.3.5

Author

  • T00rk

Made with

  • HTML / CSS / JS

About a code

Bootstrap Material DateTimePicker

Originaly designed for Bootstrap Material, the V2.0 is now completely standalone and responsive.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Bootstrap version: 3.3.2

Author

  • Munim Munna

Made with

  • HTML / CSS / JS

About a code

Bootstrap 3/4 Date/Time Picker with Clock-Like Time-Picker

A clock-like time-picker has been introduced into it and the widget is optimized to make it compatible to both Bootstrap 3 and 4 versions.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Bootstrap version: 4.0.0

Demo image: JTSage-DateBox

Author

  • J.T. Sage

Made with

  • HTML / CSS / JS

About a code

JTSage-DateBox

A multi-mode date and time picker for Bootstrap (3 & 4)

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Bootstrap version: 4.3.1