# Pass Swap
URL: https://remocn.dev/docs/typography/pass-swap

An object sweeps across the frame and each pass swaps the headline to the next line.

- Install: `npx shadcn@latest add @remocn/pass-swap`
- Vibe: clean
- Natural length: 122f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/pass-swap
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { PassSwap } from "@/components/remocn/pass-swap";

const PassSwapScene = () => (
  <PassSwap lines={["Copy the code.", "Own every frame.", "Ship the film."]} shape="disc" />
);

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

A slab or disc crosses the frame, and every pass replaces the headline with the next entry in `lines`. Pass `lines`, and use `src` with a transparent PNG to sweep your own product cutout instead of the built-in shape. It ships in light and dark through the `theme` prop.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `lines` | `string[]` | — | Headlines in order; each pass of the object swaps to the next one. |
| `shape` | `"slab" \| "disc" \| "mixed"` | `"mixed"` | Object when no `src` is given; "mixed" alternates slab and disc per pass. |
| `src` | `string` | — | A product cutout (transparent PNG) to sweep instead of the shape. |
| `accentLastWord` | `boolean` | `true` | Fill the last word of the final line with the object gradient. |
| `accent` | `string` | `"#3B5BFD"` | Accent color override; falls back to the theme accent. |
| `theme` | `"dark" \| "light"` | `"dark"` | Ships light and dark; picks the palette. |
| `speed` | `number` | `1` | Playback speed multiplier for the whole timeline. |

## Use when
- A three-line pitch where each beat is punctuated by a moving object.
- A product reveal where a cutout sweeps through the headline.
- A rhythmic launch hook with a clear final poster frame.

## Don't use when
- You want focus pulls between lines, not a moving object — use `focus-front-swap`.
- Lines should shift layout without any object — use `layout-swap`.
- Only one word should change — use `pinned-word`.