# Introduction (/docs)

Copy-paste presentation components for React. Built on reveal.js, works with the shadcn CLI.

> For the complete documentation index, see [llms.txt](/llms.txt). Markdown variants are available by appending `.md` to any URL or sending an `Accept: text/markdown` header. An agent skill is available at [/.well-known/agent-skills/site-skill.md](/.well-known/agent-skills/site-skill.md).





**slidecn** provides beautifully designed and customizable presentation components. Built on [reveal.js](https://revealjs.com/) with [`@revealjs/react`](https://github.com/hakimel/reveal.js/tree/master/react) and designed to work seamlessly with the [shadcn CLI](https://ui.shadcn.com).

## Philosophy [#philosophy]

slidecn follows the shadcn model for presentations: copy-paste components you can own, with zero lock-in and sensible defaults that work immediately.

Decks often sprawl across one-off JSX and inline styles. slidecn keeps themes, components and blocks consistent, while you can still use raw `Slide` markup from `@revealjs/react` whenever you need it.

The goal is simple: make presentations feel like the rest of your stack — composable, themeable, and easy to customize.

## Why slidecn? [#why-slidecn]

Most presentation components are either locked into a SaaS editor or ad hoc in the repo. slidecn is for teams that want to ship decks from the same React codebase without giving up control:

* **Own Your Code:** Copy components into your project and change markup, copy, and styles freely.
* **Start Fast:** Run one command and render a deck with production-ready slide primitives.
* **Scale Safely:** Build on top of reveal.js, then drop to lower-level APIs when you need full control.

## Features [#features]

<div className="not-prose grid gap-4 sm:grid-cols-2 mt-4">
  <FeatureCard icon="ZapIcon" title="Zero Config" description="Works out of the box with sensible defaults. No boilerplate needed." />

  <FeatureCard icon="SunMoonIcon" title="Theme Aware" description="Automatically adapts colors to your chosen slide theme." />

  <FeatureCard icon="LayoutGridIcon" title="Composable" description="Build full decks from title, section, content, split, and specialty slides." />

  <FeatureCard icon="Code2Icon" title="TypeScript" description="Full type safety with comprehensive TypeScript support." />

  <FeatureCard icon="ClipboardCopyIcon" title="Copy & Paste" description="Own your code. No runtime dependencies, just install into your project." />

  <FeatureCard icon="BlocksIcon" title="shadcn Compatible" description="Uses the same registry format — add components with npx shadcn add." />
</div>