All Tutorials

How to activate the free-hand date range selection mode in the Angular date picker component (Navigator).

How to use the open-source React resource calendar component to create a scheduling application for multiple groups of resources (locations, people, tools). Add a date picker and next/previous buttons that let users change the visible date.

How to create a monthly calendar/scheduler view for planning events, tasks, and reminders in Vue. The downloadable Vue project uses the open-source DayPilot Lite library.

Angular tutorial that shows how to highlight global and resource-specific holidays in the Angular Scheduler UI component.

Angular application that shows how to apply a custom CSS theme to the calendar component and change it on the fly.

How to use a popup date picker to select a date displayed by the React Calendar component.

Learn how to modify the reservation edges to split the start and end cell diagonally. This provides a visual hint that the check-in and check-out days are only partially occupied.

This tutorial shows how to implement undo/redo functionality the for the open-source Angular Calendar component.

React application that displays a monthly event calendar. Calendar events use custom background to show event type. A context menu allows deleting events and changing color.

Learn how to change a React Scheduler CSS theme, create and apply your own theme and override individual styles.