# Feature Headline
URL: https://remocn.dev/docs/typography/feature-headline

A tag pill opens from the left, then a headline rises word by word with a supporting subhead.

- Install: `npx shadcn@latest add @remocn/feature-headline`
- Vibe: premium
- Natural length: 39f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/feature-headline
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { FeatureHeadline } from "@/components/remocn/feature-headline";

const FeatureHeadlineScene = () => (
  <FeatureHeadline
    tag="New"
    label="Captions"
    headline="Captions that move with every word."
    highlight="every word"
  />
);

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

A pill with a tag and label opens, the headline words rise in turn with `highlight` in the accent, and the subhead fades in; with `exit` on, everything lifts away in the last frames of the Sequence. Pass `tag`, `label`, `headline`, `highlight` and `subhead`; it ships light and dark through `theme`.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `tag` | `string` | `"New"` | Short badge text inside the pill, such as New |
| `label` | `string` | `"Captions"` | Pill label; empty hides the pill |
| `headline` | `string` | `"Captions that move with every word."` | Main headline; words rise in one by one |
| `highlight` | `string` | `"every word"` | Phrase inside the headline shown in the accent color |
| `subhead` | `string` | `"31 transcript-driven caption styles, ready to drop into any video."` | Supporting line under the headline; empty to hide |
| `align` | `"left" \| "center"` | `"left"` | Text alignment: left or center |
| `exit` | `boolean` | `true` | Play an exit animation in the last frames |
| `accent` | `string` | `"#3B5BFD"` | Accent color (any valid CSS color) |
| `background` | `string` | — | Overrides the theme's stage color |
| `speed` | `number` | `1` | Playback speed multiplier |
| `theme` | `"dark" \| "light"` | `"dark"` | Ships light and dark palettes |

## Use when
- A feature spotlight with a New tag, a one-line headline and a short subhead.
- A chapter title in a product tour that should enter and leave cleanly.

## Don't use when
- You need a centered cinematic title with no tag - use `tracking-in`.
- You want only a bare text exit - use `blur-out-up`.
- The headline needs a typed feel - use `typewriter`.