7 Best Vue.js Calendar Components To Create Event Calendars On The App (2023 Update)

A calendar is one of the most important components used to display tasks, schedules, appointments, and meetings in an elegant way.

This is a hand-picked list of the 7 best Vue.js components to help create various calendars you might need in the next Vue.js project. Have fun.

Originally published Feb 18 2020, updated Mar 08 2023

1. Clean And Lightweight Calendar Plugin For Vue.js – V-Calendar

V-Calendar

Demo Download

A lightweight, dependency-free plugin for building attributed calendars in Vue.js.


2. vue-cal

vue-cal

Demo Download

A draggable, responsive, animated event calendar component for Vue 3 or Vue 2 applications.


3. Simple Vue Component To Show Calendar With Events

Simple Vue Component To Show Calendar With Events

Demo Download

A simple Vue component to show a month-grid calendar with events.


4. mpvue-calendar

V-Calendar

Demo Download

A calendar component for vue 3. Support gesture sliding, range selection.


5. Functional Calendar

Modern Calendar And Datepicker For Vue – Functional Calendar

Demo Download

A lightweight, powerful, high-performance calendar & date picker component for Vue applications.


6. Full Featured Calendar Component For Vue.js – kalendar

Full Featured Calendar Component For Vue.js - kalendar-min

Demo Download

A Vue.js component to create a full featured, responsive, lightweight calendar in the browser.


7. Event Calendar & Date Picker For Vue 3 – Qalendar

Event Calendar & Date Picker For Vue 3 – Qalendar

Demo Download

A Vue 3 event calendar & date picker library written in Typescript.


More Resources:

Looking for more JavaScript libraries and Vue.js components for modern web app design? Here are a few resources you might find useful: