< DHTMLX Event Calendar 2.2 with Improved Recurring Events and Much More

Light-Weight JavaScript Event Calendar for
Efficient Time Management

DHTMLX helps you develop a Google-like JavaScript event calendar for efficiently organizing appointments.

Users can manage events by drag-n-drop and display them in six different modes.

Live Demo

JavaScript Event Calendar Features

  • Lightweight
  • Simple JavaScript API
  • Six default views: Day, Week, Month, Year, Agenda, Timeline
  • Custom views
  • Creating, resizing, and moving events by drag-n-drop
  • Recurring events
  • Attaching files to appointments
  • Overlay events
  • Multiday events
  • Built-in datepicker in the sidebar
  • Categorizing events by adding multiple calendars
  • Autosaving of the appointment data
  • Current time marker
  • Auto-scrolling
  • Adjustable view modes
  • Configurable panel editor
  • Stylization via CSS variables
  • Dynamic loading
  • Read-only mode
  • Localization
  • Easy Rest API integration
  • TypeScript support
  • Work in all modern web browsers
  • Unassigned events
  • Dimming past events

Construct Your JS Event Calendar With Ease

You can build a personalized JavaScript day planner right out of the box.

Modifying editor controls
Choose the fields to display for managing the events data. You may add a file uploader to attach files to the selected event or set a control to choose event color from the UI.
Configuring calendar behavior
Allow users to manage events via drag-n-drop or block all operations by setting a readonly mode. You can use readonly for the whole calendar or for specific events.
Using built-in themes
Select one of the embedded themes to change the overall Event Calendar appearance, e.g. Material, Willow, and Willow Dark. However, you’re free to apply custom styling using CSS variables.

Why Choose JavaScript Event Calendar Widget by DHTMLX?

gantt chart web development
For Developers
Pure JS library with no dependencies
Modern easy-to-use JavaScript API
Smooth integration with DHTMLX Kanban and To Do List widgets
Simplified customization via CSS variables
Short learning curve equipped with well-structured documentation and detailed code samples
gantt chart web development
For Project Managers
Maintaining strong data security level without having to transfer data to third-party tools
Ability to easily combine the most-used Agile planning tools
Relying on technical experts with over 10-years expertise in developing effective project management solutions
Transparent licensing policy

vs

DHTMLX Event Calendar

  • Small and lightweight
  • Simple and modern API
  • Perfect component for creating Google-like calendars with settings working out-of-the-box
  • 6 default views (Day, Week, Month, Year, Agenda, and Timeline) and the ability to create custom ones
  • 3 CSS themes (Material, Willow, Dark)
  • Read-only mode for specific events or the whole calendar
  • The same architecture and design approach as in Kanban and To Do List

DHTMLX Scheduler

  • Big and complex
  • Extensive API
  • Adaptable solution with numerous configurations for developing any scheduling apps
  • 10 views and the ability to add custom ones
  • 5 skins (Terrace, Material, Flat, Contrast Black and White)
  • Read-only mode for specific events, the whole calendar, lightbox, or specific lightbox fields
  • The same architecture and design approach as in Gantt

DHTMLX Event Calendar and Scheduler are two separate JavaScript libraries with different capabilities. They provide unique feature sets and can be suited for different-purpose projects. Learn more about DHTMLX Scheduler

Benefits of Opting for DHTMLX JS Event Calendar

Out-of-the-box js event calendar
Out-of-the-box js event calendar
DHTMLX Event Calendar is a lightweight version of a scheduling calendar with clean Material-based UI. It provides all the necessary functionality out of the box. Thus, you can easily build a Google-like event calendar with day, week, and month views, ability to create multiday and overlay events, and intuitive drag-n-drop behavior.
Modern JavaScript API
Modern JavaScript API
You’ll enjoy configuring an Event Calendar via its simple and modern API. It includes a broad range of methods, events, and properties ensuring full control over the widget's look and feel. You can configure view modes, change the behavior of creating and rescheduling events, modify the editor appearance, and show or hide the sidebar.
Smooth integration with other DHTMLX widgets
Smooth integration with other DHTMLX widgets
You may create a complete time management web app by combining DHTMLX Event Calendar with Kanban board and To Do List. Having equally simple APIs and clean UIs, these widgets can be easily used and configured within a single app as well as styled using the same CSS variables.
Flexible UI customization
Flexible UI customization
Our Event Calendar provides 3 built-in CSS themes: Material, Willow, and Dark. However, you can apply custom themes while also changing the calendar appearance via CSS variables. It's possible to modify the event shape, color, and content, set different colors to the sidebar calendars, as well as specify custom templates for the Calendar visual elements.

DHTMLX Event Calendar Pricing

Individual Commercial Enterprise Ultimate
License Terms
Individual
Commercial
Enterprise
Ultimate
Developers
Individual
1
Commercial
5
Enterprise
20
Ultimate
Projects
Individual
1
Commercial
1
Enterprise
5
Ultimate
Use in SaaS (unlimited end-users)
Individual
Commercial
Enterprise
Ultimate
Perpetual distribution rights
Individual
Commercial
Enterprise
Ultimate
Support Plan
Individual
Standard Support
Commercial
Premium Support
Enterprise
Premium Support
Ultimate
Ultimate Support
Time Period
Individual
1 year
Commercial
1 year
Enterprise
1 year
Ultimate
1 year
Updates
Individual
Major, minor, and maintenance updates
Commercial
Major, minor, and maintenance updates
Enterprise
Major, minor, and maintenance updates
Ultimate
Major, minor, and maintenance updates
Priority queue for bug fixing
Support requests
Individual
10
Commercial
30
Enterprise
50
Ultimate
Response Time
Individual
72h
Commercial
48h
Enterprise
48h
Ultimate
24h
Personal Account Manager
Individual
Commercial
Enterprise
Ultimate
Event Calendar

Try JavaScript Event Calendar for Free

Download a free trial to estimate Event Calendar features and benefit from:

30 days of use without charge

Official technical support

Well-documented guides and code samples

Other DHTMLX Products

Need help with DHTMLX Event Calendar integration into your app? Contact us