# Strata
URL: https://remocn.dev/docs/shaders/components/shader-strata

Fine horizontal sediment layers displaced by fbm noise, each drifting at its own depth

- Install: `npx shadcn@latest add @remocn/shader-strata`
- Vibe: clean
- Natural length: 150f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/shader-strata
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { ShaderStrata } from "@/components/remocn/shader-strata";

const ShaderStrataScene = () => (
  <ShaderStrata speed={1} layers={14} amplitude={0.16} />
);

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

A custom WebGL shader written for the Remocn registry — frame-driven and
deterministic, with no wall-clock time. Each layer's edge is displaced by fbm
noise and drifts at its own depth speed, so the stack reads as a living
foundation rather than a gradient. Pass `colors` bottom-to-top and lift
`accentAmount` to tint the layers with `accent`.

## Use when
- Calm, grounded, geological ambient backdrops — foundations, stability, "built on" narratives.
- A scene wants texture and depth without directional motion.
- You want each layer moving at its own depth speed rather than a single flat gradient.

## Don't use when
- You want motion with a clear direction or flow — use `shader-warp`.
- You want cellular texture instead of layered sediment — use `shader-voronoi`.