[ES6] Simple Pure JavaScript Calendar | rolyart-calendar


rolyart-calendar is a Simple Pure JS calendar library (ES6) for showing a basic, clean, built-in, multi-language calendar component on the web app.


  • Add rolyart-calendar.js
  • Add style.css
  • Add calendar container <div id=”myCalendar”></div>
  • Init calendar: const config = { container: ‘calendar’, months: [“January”, “February”, “March”, “Aprile”, “May”, “June”, “July”, “August”, “September”, “October”, “November”, “December”], weekDays: [“S”, “M”, “T”, “W”, “T”, “F”, “S”], } let calendar = new RolyartCalendar(config)

How to make use of it:

Import the Rolyart Calendar’s JavaScript and Stylesheet into the doc.

<link href="style.css" rel="stylesheet" />
<script src="rolyart-calendar.js"></script>

Create a container to hold the calendar.

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

Initialize the calendar, specify the target container and define the week/month names as follows:

let calendarConfig = {
    container: 'calendar',
    months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
    weekDays: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
const calendar = new RolyartCalendar(calendarConfig);

Clean ES6 Calendar Componnet, rolyart-calendar Plugin/Github

See Demo And Download

Official Website(rolyart): Click Here

This superior jQuery/javascript plugin is developed by rolyart. For extra advanced usage, please go to the official website.