Test Live: Bootstrap 5 Datepicker

<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap 5 Datepicker</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>

<link href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" rel="stylesheet">

<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">

</div>
	 
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    flatpickr("#datepicker", {
      dateFormat: "Y-m-d", // Adjust the format as needed (e.g., Y-m-d, d-m-Y, etc.)
      allowInput: true // Allows manual input
    });
  });
</script>

</body>
</html>

Go to Tutorialdeep Homepage