Mesh Gradient Background
Living gradient blobs on a dark stage.
PrimitiveAdvanced
mesh-gradient-bg30fps · 960×540
Install
$ npx remotion-ui@latest add mesh-gradient-bgFull-frame ambient background with drifting phosphor, ember, and rose blobs on #050505.
Agent notes
Install first, then import the copied source component locally. AI guide →
Import
@/remotion/primitives/mesh-gradient-bg- Use when: frame-level motion primitives and reusable animation wrappers.
- Customize: backgroundColor, colors, intensity, plus copied source for timing, layout, colors, and typography.
- Rule: do not import this component from the
remotion-uinpm package; it is copied into your project.
Usage
Example
import { MeshGradientBg } from "@/remotion/primitives/mesh-gradient-bg";
<MeshGradientBg />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| backgroundColor | string | "#050505" | Stage color. |
| colors | [string, string, string] | ["#e8b86d", "#e07a5f", "#c2557a"] | Blob accent colors: solid hex, screen-blended over the stage. |
| intensity | number | 1 | Drift amplitude multiplier. |