# Grain Dissolve
URL: https://remocn.dev/docs/transitions/grain-dissolve

Disintegrate the outgoing scene into soft grainy shapes and condense the next scene out of the noise

- Install: `npx shadcn@latest add @remocn/grain-dissolve`
- Vibe: premium
- Natural length: 76f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/grain-dissolve
```

## Usage

`grainDissolve()` is a Remotion transition presentation. Pass it to a
`TransitionSeries.Transition` between two sequences. The grain field starts as
flat, hard-edged shapes and both `intensity` and `softness` sweep from 0 to 1
across the transition — the figures grow, roughen into grain, and the incoming
scene condenses out of the dissolved texture. Give the sweep enough frames to
read (76 works well).

```tsx
import { TransitionSeries, linearTiming } from "@remotion/transitions";
import { grainDissolve } from "@/components/remocn/grain-dissolve";

export const MyVideo = () => (
  <TransitionSeries>
    <TransitionSeries.Sequence durationInFrames={96}>
      <SceneA />
    </TransitionSeries.Sequence>
    <TransitionSeries.Transition
      timing={linearTiming({ durationInFrames: 76 })}
      presentation={grainDissolve()}
    />
    <TransitionSeries.Sequence durationInFrames={96}>
      <SceneB />
    </TransitionSeries.Sequence>
  </TransitionSeries>
);
```

The `shape` prop picks the figure family the field is built from — `"wave"`,
`"dots"`, `"truchet"`, `"corners"`, `"ripple"`, `"blob"`, or `"sphere"`. Shapes
are discrete (they cannot blend into each other), but each one gives the same
sweep a different character: `"blob"` reads organic, `"wave"` calm and banded,
`"dots"` halftone-like, `"sphere"` volumetric.

## Props

`grainDissolve(props)` accepts:

| Prop | Type | Default | Description |
|---|---|---|---|
| `colors` | `string[]` | `["#3a3a52", "#4a4a68", "#8f88ae"]` | Colors of the grain shapes, up to 7. |
| `colorBack` | `string` | `"#141318"` | Backdrop behind the shapes during the transition. |
| `shape` | `string` | `"blob"` | Figure family of the field. One of wave, dots, truchet, corners, ripple, blob, sphere. |
| `noise` | `number` | `0.3` | Amount of per-pixel grain over the shapes. |
| `zoom` | `number` | `2` | Magnification of the figure field. Raise it until the shapes fill the frame, lower it to show more of the backdrop. |
| `speed` | `number` | `1` | Shader animation speed. |

## Use when
- The video has an editorial, textured, analog feel — grain reads as film and print.
- Chapter or mood changes where the scene should decompose rather than move.
- The `shape` prop should match the brand: `blob` organic, `wave` calm, `dots` halftone, `sphere` volumetric.

## Don't use when
- The transition must be fast — under ~50 frames the intensity/softness sweep has no room to read.
- The tone is crisp and minimal — the grain texture adds visual noise by design.