# Tracking In
URL: https://remocn.dev/docs/typography/tracking-in

Letter-spacing collapses and blur clears with a springy entrance

- Install: `npx shadcn@latest add @remocn/tracking-in`
- Vibe: premium
- Natural length: 90f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/tracking-in
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { TrackingIn } from "@/components/remocn/tracking-in";

const TrackingInScene = () => (
  <TrackingIn text="REMOCN" startTracking={0.6} startBlur={14} />
);

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

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `text` (required) | `string` | — | The text to animate |
| `startTracking` | `number` | `0.5` | Initial letter-spacing in em. Animates down to -0.03em. |
| `startBlur` | `number` | `12` | Initial blur radius in pixels. Animates down to 0. |
| `fontSize` | `number` | `96` | Font size in pixels |
| `fontWeight` | `number` | `700` | CSS font-weight |
| `color` | `string` | `"#171717"` | Text color (any valid CSS color) |
| `speed` | `number` | `1` | Playback speed multiplier (1 = normal, 2 = twice as fast) |
| `className` | `string` | — | Optional className passed to the underlying span |

## Use when
- A title word or brand name should feel like it is focusing into place — tracking collapse is the right metaphor for clarity, precision, or sharpness.
- The design is typographically driven and the letter-spacing motion is the centerpiece of the entrance.
- A premium or cinematic tone is required — the spring-driven collapse reads as designed and intentional, not incidental.

## Don't use when
- You want per-character stagger — `tracking-in` moves all letters as one unit; use `soft-blur-in` for a per-character blur-and-rise stagger instead.
- The text is a sentence rather than a single bold word — wide initial tracking on a long phrase is illegible until it collapses; use `staggered-fade-up` for multi-word body text.
- The scene is playful or casual — the typographic tracking motion reads as serious and editorial; use `spring-scale-in` for a bouncy entrance instead.