MOTIONSTASH
All components

Film Grain Overlay

Backgrounds

Deterministic per-frame grain, scanlines and a vignette, seeded on the frame index so it reproduces byte-for-byte

Download preview768×432 preview render. The full-resolution file comes from running the component
5 seconds
Format

This is the format it was composed for. Switch above to see it lay itself out for another: same animation, re-arranged for the frame.

grainoverlaytexturedeterministicfilm
What you can change · 6 settings

Everything below can be changed without touching the animation. Hand the list to an agent, or edit the values at the bottom of the component file.

  • Grain
    grain · number

    Grain strength. Above ~0.7 it reads as texture rather than film.

    now: 0.5

  • Cells
    cells · number

    Grain cells across the frame. Higher is finer but costs render time.

    now: 48

  • Scanlines
    scanlines · boolean

    Add faint horizontal scanlines.

    now: false

  • Vignette
    vignette · number

    Corner darkening.

    now: 0.55

  • Headline
    headline · string

    Sample copy shown beneath the overlay, so the preview reads in context.

    now: Shot on code

  • Brand
    brand · string

    Brand token id, one of the keys of BRANDS.

    now: slate

For developers · source, dependencies and provenance

Dependencies

remotion@remotion/shapeszod

No Tailwind, no CSS, no asset files. Inline styles only.

Source

Filesrc/registry/items/film-grain-overlay.tsx
Frame1920×1080
Duration150f · 5s @ 30fps

Provenance

ToolClaude Code
ModelOpus 5
Authormotionstash
LicenseMIT

Prompt

An animated film grain and vignette overlay that changes every frame but renders identically every time, shown over a sample headline so the effect reads in context.