# Deck

<StatusBadge status="available" /> `format: deck` is the default format: every scene is a **slide**.

<StoryEmbed slug="showcase" />

## What you get

| Feature                                                                                  | Where to read more                                                                                         |
| ---------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- |
| Ten layouts: cover, section, grid, columns, split, image left / right, background image… | [Layouts](/formats/deck/layouts)                                                                           |
| Code highlighted with Shiki, tabbed code groups, KaTeX math, Mermaid diagrams            | [Code, math & diagrams](/documentation/writing/code-math-diagrams)                                         |
| Speaker notes and progressive steps                                                      | [Notes & steps](/documentation/writing/notes-and-steps)                                                    |
| MDX: React components and expressions in slides                                          | [MDX](/documentation/writing/mdx)                                                                          |
| Colors, fonts, radius, footer, dark mode, 16:9 or 4:3, transitions                       | [Theme](/theme/overview)                                                                                   |
| Density rules and accessibility checks with line numbers                                 | [Density rules](/formats/deck/density-rules), [Accessibility](/documentation/reference/accessibility)      |
| Presenter console, laser pointer, pen, smartphone remote                                 | [Presenter console](/formats/deck/presenter-console), [Smartphone remote](/formats/deck/smartphone-remote) |
| Static site, single HTML file, PDF                                                       | [Exporting](/formats/deck/exporting)                                                                       |
| Embeds in a Récit site, with per-slide search                                            | [Stories in a site](/documentation/integrations/site-stories)                                              |

## A minimal deck

```md title="slides.md"
---
title: Lorem ipsum
author: Dolor Sit
---

--- layout=cover

# Lorem ipsum

--- layout=grid cols=2

# Two ideas

:::card
### Simple
Plain Markdown, nothing else.
:::

:::card
### Complete
Themes, exports, presenter console.
:::
```

```bash
npx recit dev slides.md
```

## Packages

| Package             | Role                                                                 |
| ------------------- | -------------------------------------------------------------------- |
| `@recit/core`       | parses and compiles the story (`compileStory`), configuration, rules |
| `@recit/deck`       | React runtime: stage, slides, steps, presenter console, remote       |
| `@recit/components` | the components used in the slides                                    |
| `@recit/theme`      | tokens and styles of the slides, print styles                        |
| `@recit/cli`        | `recit init`, `dev`, `build`, `export`                               |

## Examples

The repository ships six decks in `examples/deck-*`: starter, tech-talk, showcase, pitch, course and
mdx. They are played, with their source, on [presentation.recit.dev](https://presentation.recit.dev). Run one
locally with `pnpm --filter recit-example-deck-showcase dev`.
