# Chore Fold
URL: https://remocn.dev/docs/typography/chore-fold

A teal "Captions does all of that." folds the chore away, "You just talk." beneath

- Install: `npx shadcn@latest add @remocn/chore-fold`
- Vibe: clean
- Natural length: 146f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/chore-fold
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { ChoreFold } from "@/components/remocn/chore-fold";

const ChoreFoldScene = () => <ChoreFold steps={["Export the audio.", "Fix every timestamp by hand."]} name="Captions" result="does all of that." payoff="You just talk." />;

export const RemotionRoot = () => (
  <Composition
    id="ChoreFold"
    component={ChoreFoldScene}
    durationInFrames={180}
    fps={30}
    width={1280}
    height={720}
  />
);
```

A list of tedious manual steps appears line by line, then folds away from the outside in until the middle is left, and the hero sentence swaps in with the tool name highlighted before the payoff line lands. Pass `steps`, `label`, `name`, `result` and `payoff`; it fits the read time to the composition length.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `steps` | `string[]` | `DEFAULT_STEPS` | The manual chores shown first, one per line. |
| `label` | `string` | `"By hand"` | Small label above the list of chores. |
| `name` | `string` | `"Captions"` | Product or tool name highlighted in the hero line. |
| `result` | `string` | `"does all of that."` | Rest of the hero sentence after the name. |
| `payoff` | `string` | `"You just talk."` | Short closing line shown beneath the hero. |
| `accent` | `string` | — | Color of the highlighted name; defaults to the theme accent. |
| `background` | `string` | — | Stage fill color; pass "transparent" to overlay your own footage. |
| `speed` | `number` | `1` | Playback multiplier for the whole timeline. |
| `theme` | `"dark" \| "light"` | `"dark"` | Color scheme; ships dark and light. |

## Use when
- A before-and-after beat where a list of chores is replaced by one product line.
- A pain-point montage that ends on the benefit in one short sentence.
- A launch scene where the tool name is the hero and the payoff is a two-word promise.

## Don't use when
- You want pain points to dim toward one claim rather than fold away — use `what-sticks`.
- The objections need answers one at a time — use `exactly`.
- You want a simple three-item benefit list — use `feature-trio`.