# Tategaki Turn
URL: https://remocn.dev/docs/typography/tategaki-turn

Words drop in as vertical columns, then swing upright into one horizontal line.

- Install: `npx shadcn@latest add @remocn/tategaki-turn`
- Vibe: clean
- Natural length: 86f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/tategaki-turn
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { TategakiTurn } from "@/components/remocn/tategaki-turn";

const TategakiTurnScene = () => <TategakiTurn text="Read it both ways." highlight={3} />;

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

Each word of `text` drops in as a vertical column, letter by letter. After a hold, the columns swing 90 degrees and travel into a single horizontal line while the type scales up. The `highlight` word, the last by default, takes the accent color; it ships light and dark through `theme`.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `text` | `string` | `"Read it both ways."` | The phrase; each word becomes a vertical column. |
| `highlight` | `number` | — | Index of the word set in the accent color. Defaults to the last. |
| `hold` | `number` | `16` | Frames the vertical columns hold before they turn. |
| `accent` | `string` | — | Highlight color. Defaults to vermilion. |
| `background` | `string` | — | Stage color. Overrides the theme background. |
| `speed` | `number` | `1` | Playback speed multiplier. |
| `theme` | `"dark" \| "light"` | `"dark"` | Light or dark ground; ships both. |

## Use when
- A tagline that plays on reading direction, with vertical Japanese-style columns turning to a line.
- A clean explainer beat where a short phrase should rearrange itself as the camera pulls out.
- A minimal title with a single accent word, for a calm editorial tone.

## Don't use when
- The phrase is long and should type out naturally — use `typewriter`.
- Words should build into a phrase from the center — use `kinetic-center-build`.
- You want a simple staggered entrance with no rotation — use `staggered-fade-up`.