DayPilot
Resource timeline
LiteProPlan bookings, shifts and jobs across people, rooms or equipment. Resources run down the side; time runs across the top.
Scheduler component
DayPilot for JavaScript
JavaScript scheduling components
Build calendars, resource planners and project timelines with DayPilot. Use JavaScript or TypeScript, or work with components for Angular, React and Vue.
Find the view for your application
Start with the layout your users recognize. Configure the time range, appearance and interactions, then connect the view to your application's data.
Resource calendar
LiteProSee a day's appointments for several people or places side by side. Each resource has its own column on a shared time axis.
Calendar component
Day and week calendar
LiteProGive appointments a familiar home. Show one day, a working week or a custom range, with time running down the page.
Calendar component
Monthly calendar
LiteProPlan across dates rather than hours. Display one-day and multi-day events in a month grid, with room for overlapping activities.
Month component
Yearly calendar
ProBring the year into one view. Compare dates across months for leave, availability, recurring activities and longer-term plans.
Calendar component
Timesheet
ProShow how the working day is spent. Put dates in rows and hours across the top to review activities, assignments and recorded time.
Scheduler component
Gantt chart
ProFollow a project from task to task. Show hierarchy, dependencies, milestones and progress on a shared timeline.
Gantt component
Kanban board
ProFollow work through its stages. Move task cards between status columns and group them into swimlanes when the workflow needs it.
Kanban component
Several views use the same underlying component. Browse components and capabilities, or check the Lite and Pro feature comparison for exact availability.
Make the schedule work like your application
Apply your scheduling rules
Keep a machine clear during maintenance, reject an overlapping booking, or explain why a technician is unavailable. In DayPilot Pro, your rules can respond while an event is being dragged, before the user commits the change.
Explore Scheduler drag-and-drop validation and Calendar drag validation.
Keep control of data and presentation
Load events from your backend, decide what each interaction saves, and render the details that matter to your users. Status colors, event actions and resource information can all reflect your own data.
The Scheduler tutorial with a PHP backend shows how the pieces fit together.
Choose an edition
Start with the open-source components or use the advanced planning features in DayPilot Pro.
Open source
DayPilot Lite
Scheduler, Calendar, Month and Navigator under the Apache License 2.0. Free for personal and commercial use.
Includes core drag-and-drop interactions and customization for building your scheduling interface.
Commercial
DayPilot Pro
Add resource hierarchies, advanced drag-and-drop rules, dependencies, workload displays and export. Includes Gantt and Kanban.
Use the feature comparison to check the capabilities your application needs.
Start with a working configuration
Use the UI Builder to configure a live preview and download a starter project. Change the time scale, resources and interactions before bringing the component into your application.
Build from an example
Start with a runnable JavaScript Scheduler project, or browse tutorials for calendars, resource planning and backend integration.
Make it fit your interface
Style events and resources to match your application. The Theme Designer provides a visual starting point for component themes.
Ready to look closer? Browse the documentation and API reference, follow the release history, or get support.