Now with Resource View & Recurring Events
The React Calendar
You'll Actually Enjoy
Build scheduling features in minutes, not months. A beautifully crafted React calendar component with drag & drop, dark mode, and full TypeScript support.
Demo
Experience the Difference
Try both versions below. Create events, switch views, and see why developers choose Pro.
December 2025
Pro Features
Time Savings
Stop Building Calendars.
Start Shipping Features.
Building a production-ready calendar scheduler is complex and time-consuming. See how CalendarKit gets you to market faster than building from scratch or using AI.
Build from Scratch
Solo Developer
Building a production-ready calendar scheduler from scratch requires significant time investment.
Build with AI
Developer + AI Tools
AI can accelerate development, but you still need to integrate, test, and refine everything.
Use CalendarKit
Production-Ready Solution
Install, configure, and you're ready to ship. Focus on your business logic, not reinventing calendars.
A senior developer costs $75-150/hour. Building from scratch = 160-240 hours × $75-150 = $12,000-36,000 in development costs alone.
CalendarKit Pro = $149 one-time. That's a 99.6% cost reduction and you ship 4-6 weeks faster.
Plus ongoing maintenance, bug fixes, and feature updates—all included.
Use Cases
Built for Every Scheduling Need
From booking systems to project management, CalendarKit adapts to your use case with flexible views and customizable features.
Project Management
Sprint planning, task scheduling, and deadline tracking for agile teams.
Booking & Appointments
Medical appointments, salon bookings, and consultation scheduling.
Team Collaboration
Meeting coordination, resource allocation, and room booking systems.
Event Management
Conference schedules, event planning, and agenda management.
HR & Workforce
Shift scheduling, time tracking, and employee availability management.
Education
Class schedules, course planning, and academic calendar systems.
Features
Developer-First Features
Everything you need to build great scheduling experiences. Nothing you don't.
Easy Setup
npm install & import. Get your first calendar running in under 5 minutes with minimal configuration.
Fully Styled
Beautiful out of the box with Tailwind CSS. Full theme control with CSS variables for complete customization.
TypeScript First
Full type safety with exported types & interfaces. Excellent IDE support and autocomplete.
Dark Mode
Built-in light & dark themes that respect system preferences. Toggle with a single prop.
Drag & Drop
Smooth event dragging with snap-to-grid powered by dnd-kit. Resize events intuitively.
i18n Ready
Multi-language support with date-fns locales. Built-in translations for common UI elements.
Easy to Integrate
Copy-paste ready code examples. Works with any React framework and backend.
import { BasicScheduler } from '@calendarkit/react';
import { useState } from 'react';
export default function MyCalendar() {
const [events, setEvents] = useState([
{
id: '1',
title: 'Team Meeting',
start: new Date(2025, 0, 15, 10, 0),
end: new Date(2025, 0, 15, 11, 0),
color: '#3b82f6'
},
{
id: '2',
title: 'Lunch Break',
start: new Date(2025, 0, 15, 12, 0),
end: new Date(2025, 0, 15, 13, 0),
color: '#10b981'
}
]);
return (
<BasicScheduler
events={events}
onEventClick={(event) => console.log('Clicked:', event.title)}
onTimeSlotClick={(date) => {
const newEvent = {
id: Date.now().toString(),
title: 'New Event',
start: date,
end: new Date(date.getTime() + 60 * 60 * 1000),
color: '#8b5cf6'
};
setEvents([...events, newEvent]);
}}
/>
);
}Testimonials
Loved by Developers
See what developers are saying about CalendarKit.
“CalendarKit saved us weeks of development time. The drag & drop just works, and the TypeScript types are excellent.”
Mouloud Brahimi
Senior Frontend Dev @ Linguoflow
“Finally, a calendar component that doesn't fight you. Clean API, great docs, and the dark mode support is chef's kiss.”
Karim Fergusen
Fullstack Engineer @ TMCEnlish
“We built our entire booking system on CalendarKit Pro. The timezone handling alone was worth the price.”
Emily Rodriguez
Tech Lead @ NeuraEducation
“The recurring events feature saved us from writing complex logic. Just pass the RRULE and it works.”
David Park
React Developer @ BladeChaintIT
“Best React calendar component I've used. Period. The code is clean and easy to customize.”
Anna Kowalski
Frontend Architect @ AgileTech
“Resource view was exactly what we needed for our team scheduling app. Works flawlessly.”
Valentin Fouillet
CTO @ NeuraEducation
Pricing
Simple, One-Time Pricing
Pay once, own forever. Free updates included. Get notified when we launch!
Basic
Perfect for simple scheduling needs.
- Month view
- Week view
- Day view
- Event creation & editing
- Calendar filtering
- React 18+ support
- Full TypeScript types
- MIT License
ProMost Popular
Everything you need for production apps.
- Everything in Basic
- Agenda view
- Resource view
- Drag & drop events
- Timezone support
- Dark / Light mode
- Multi-language (i18n)
- Recurring events (RRULE)
- Event attachments
- Guest management
- Upload file for event attachments
- Download event attachments
Universal
Multi-framework support for all your projects.
- Everything in Pro
- React
- Vue.js
- Angular
- Svelte
- Solid
- Web Components
- Lifetime updates
Have questions? Check our FAQ or contact us.
Frequently Asked Questions
Everything you need to know about CalendarKit. Can't find what you're looking for? Contact support
Basic includes month, week, and day views with event creation and calendar filtering. Pro adds drag & drop, agenda view, resource view, timezone support, dark mode, multi-language support (i18n), recurring events, guest management, and file attachments.
Yes! Both Basic and Pro come with a commercial license. You can use CalendarKit in unlimited projects, including client work and SaaS applications.
Yes, you receive the full source code with your purchase. This allows you to customize components, modify styles, and integrate deeply with your application.
Currently, CalendarKit supports React 18+ and Next.js. Vue, Angular, Svelte, and Solid support is coming soon with our Universal license.
Pro includes built-in support for recurring events using RRULE-style configuration. Simply add a recurrence object to your event with freq (DAILY, WEEKLY, MONTHLY, YEARLY), interval, and either count or until date.
Yes! Use the renderEventForm prop to provide your own custom event form component. You receive all necessary props including event data, save/delete handlers, and modal state.
Pro includes full timezone support using date-fns-tz. Events automatically adjust when users change timezones, and the timezone picker shows all IANA timezone identifiers.
Use the translations prop to override any UI strings. Pro includes built-in English and French translations. You can also use date-fns locales for date formatting in any language.
CalendarKit is built with TypeScript from the ground up. All components, props, and types are fully typed with excellent IDE autocomplete support.
CalendarKit is headless when it comes to data - you control the events array. Use the onEventCreate, onEventUpdate, onEventDelete, and onEventDrop callbacks to sync with any REST API, GraphQL, or real-time backend.
We don't offer a free trial, but we have a 14-day money-back guarantee. If CalendarKit doesn't meet your needs, we'll refund your purchase - no questions asked.