> ## Documentation Index
> Fetch the complete documentation index at: https://super-calendar.afonsojramos.me/llms.txt
> Use this file to discover all available pages before exploring further.

# Why super-calendar

> What super-calendar is for, and how it compares to other React and React Native calendars.

Most calendar libraries pick a side: a web-only event calendar, or a React Native
one, or a standalone date picker. super-calendar is built the other way around —
a render-agnostic [core](/guides/headless) with two renderers on top, so the same
calendar model runs in **React DOM and React Native**, from a picker to a
drag-and-drop event grid.

## What you get

* **One model, two renderers.** `@super-calendar/dom` is a pure react-dom
  renderer (no React Native runtime); `@super-calendar/native` is the Reanimated /
  Gesture Handler renderer. Both consume the same headless `@super-calendar/core`.
* **A full calendar, not just a picker.** Month, week, day, N-day, and schedule
  views — plus a scrolling date picker (`MonthList` + `useDateRange`).
* **Interaction built in.** Drag to move, resize, and create; pinch / Ctrl-scroll
  zoom; virtualized, snap-paged views that stay cheap far into the past and future.
* **Styleable two ways.** A shared [theme](/guides/theming) for palette and
  metrics, and — on the web — per-slot [Tailwind / CSS classes](/guides/styling)
  with `data-*` state variants.
* **The hard parts handled.** [Recurring events](/guides/recurring-events),
  [time-zone display](/guides/time-zones), [business hours](/guides/theming#business-hours),
  overlapping-event layout, disabled days, and screen-reader labels.

## How it compares

Every library here is good at what it targets; the axis that sets super-calendar
apart is spanning web **and** native from one API. This is a high-level map, not a
feature-by-feature scorecard — check each project for the current details.

| | super-calendar | react-day-picker | FullCalendar | react-big-calendar | react-native-calendars |
| - | - | - | - | - | - |
| Platforms | Web + React Native | Web | Web | Web | React Native |
| Scope | Picker **and** event calendar | Date picker | Event calendar | Event calendar | Picker + agenda/timeline |
| Time-grid views (week/day) | ✅ | ❌ | ✅ | ✅ | ✅ |
| Drag move / resize / create | ✅ | ❌ | ✅ (drop/resize) | ➕ addon | ⚠️ limited |
| Virtualized / paged | ✅ | ❌ | ⚠️ | ❌ | ⚠️ |
| Tailwind / per-slot classes (web) | ✅ | ✅ | ⚠️ CSS | ⚠️ CSS | n/a |
| Headless core you can reuse | ✅ | ✅ (hooks) | ❌ | ❌ | ❌ |
| License | MIT | MIT | MIT core; paid Premium add-ons | MIT | MIT |

Legend: ✅ built in · ➕ official add-on · ⚠️ partial / via CSS · ❌ not available.

For a detailed, feature-by-feature matrix against the other React Native calendar
libraries, see the [comparison](/comparison). Porting from a specific library?
There are guides for [react-native-big-calendar](/migrating-from-big-calendar),
[calendar-kit](/migrating-from-calendar-kit),
[FullCalendar](/coming-from-fullcalendar), and
[react-big-calendar](/coming-from-react-big-calendar).

## When to reach for something else

Honesty helps you pick the right tool:

* **You only need a date picker on the web.** [react-day-picker](https://daypicker.dev)
  is focused and excellent at exactly that.
* **You're web-only and want a large, battle-tested ecosystem** with resource
  timelines and scheduler add-ons — [FullCalendar](https://fullcalendar.io) is
  hard to beat (some views are paid).
* **You want a standalone, headless React Native picker** rather than a full
  calendar — [flash-calendar](https://github.com/MarceloPrado/flash-calendar)
  inspired ours and does that well.

Reach for super-calendar when you want **one calendar that works the same across
web and native**, with events, drag-and-drop, and styling that bends to your
design system.

<CardGroup cols={2}>
  <Card title="Quickstart" icon="rocket" href="/quickstart">
    Render your first calendar in a couple of minutes.
  </Card>

  <Card title="Styling with Tailwind" icon="palette" href="/guides/styling">
    Restyle any part with per-slot classes and `data-*` variants.
  </Card>
</CardGroup>

Deciding between the two renderers, or checking what each supports? See the
[dom vs native comparison](/reference/renderers).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.