# Captions: Subtitle Bar

Broadcast-style subtitles on a translucent bar, readable over anything.

```bash
npx shadcn add https://www.reelcn.dev/r/captions-subtitle-bar.json
```

Usage:

```tsx
<CaptionsSubtitleBar captions={captions} position="bottom" />
```

Use for:

- Long-form video, webinars and anything with a wide audience


## Props

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| style? | `CSSProperties` | — |  |
| className? | `string` | — |  |
| captions | `Caption[]` | — | Word-level captions, as `@remotion/captions` defines them. `pnpm reelcn-transcribe` writes this shape. |
| size? | `number` | — | Font size in design units; long pages shrink from here. |
| color? | `string` | — |  |
| pageMs? | `number` | — | How much speech goes on one page, in milliseconds. Lower means fewer words at a time. |
| maxWords? | `number` | — | Hard cap on words per page; long pages are split. |
| emphasize? | `string[]` | — | Words painted in the emphasis color. Case and punctuation are ignored. |
| position? | `"auto" \| "top" \| "bottom" \| "middle"` | — | `auto` sits above the platform UI in portrait and in the lower third elsewhere. |
| activeColor? | `string` | — |  |
| emphasisColor? | `string` | — |  |
| background? | `string` | — |  |