---
title: /create-theme
description: Extracts a theme from an existing deck (or a brief).
---

`/create-theme` codifies a visual recipe into a reusable theme file.
Run it once your decks start sharing a visual language — turn the implicit
recipe into a file the agent can read.

## What it does

Writes a **theme bundle** under `themes/` — two paired files that share a
stem:

- `themes/<id>.md` — palette, type stack, layout vocabulary, fixed
  Title/Footer/Eyebrow components, motion, and voice notes that
  `/create-slide` reads on its next run.
- `themes/<id>.demo.tsx` — a runnable 2–3 page mini-slide that inlines
  the same components from the markdown. The dev UI's **Themes** panel
  imports it and renders it as the theme's live preview.

Both files are always produced together — a theme without its demo can't
preview, a demo without its markdown can't be picked by `/create-slide`.

The input can be:

- **An existing deck.** The skill scans `slides/<id>/index.tsx`, distils the
  recurring tokens, and writes them out.
- **A brief.** Describe the system in chat (*"warm editorial, serif display,
  high-contrast palette"*) and the skill bootstraps the bundle from
  scratch.
- **Image references.** Pass screenshots or mood-board images and the
  skill extracts palette, type, and layout cues from them.

## Output

A markdown recipe:

```md title="themes/corporate.md"
# Corporate

## Palette
- ink: #0a0a0c
- accent: #4a52b5
- mint: #1f8458

## Typography
- display: 'Söhne', system-ui
- mono: 'JetBrains Mono'

## Voice
- Tight, declarative, never coy.
- One concept per slide.
```

…paired with a preview module:

```tsx title="themes/corporate.demo.tsx"
import type { Page } from '@open-slide/core';

const Cover: Page = () => (/* …inline Title / Footer using theme tokens… */);
const Content: Page = () => (/* … */);

export default [Cover, Content];
```

See [Themes](/docs/core-feature/themes) for how a theme is consumed.

## Using the theme

Once the file exists, mention it by name on the next `/create-slide`:

```text
/create-slide for "Q3 board update — use the corporate theme"
```

The agent loads `themes/corporate.md` before writing the deck.