Basic Calendar

Explore a simple example of a basic Calendar.js instance configured with the standard default options, demonstrating how to quickly set up and display an interactive calendar.

Include Files

Make sure you include the following files:

<link rel="stylesheet" href="dist/calendar.js.css">
<script src="dist/calendar.min.js"></script>

Create DOM Element

Add a new DOM element to house the Calendar.js instance:

<div id="calendar"></div>

Create Calendar.js Instance

Run the following JavaScript to create a new Calendar.js instance:

const calendarInstance = new calendarJs( "calendar" );

Result