RemotionUI

B-Roll Stack

Cinematic layered cutaway cards for creator explainers.

SceneScenes

b-roll-stack30fps · 960×540
Install
$ npx remotion-ui@latest add b-roll-stack

Stack product shots, process clips, and proof moments without hand-positioning every layer.

Agent notes

Install first, then import the copied source component locally. AI guide →

Import
@/remotion/scenes/b-roll-stack
  • Use when: full-frame scenes, overlays, cards, and reusable video sections.
  • Customize: items, kicker, title, caption, plus copied source for timing, layout, colors, and typography.
  • Rule: do not import this component from the remotion-ui npm package; it is copied into your project.

Usage

Example
import { BRollStack } from "@/remotion/scenes/b-roll-stack"; <BRollStack kicker="Cutaway" title="Layer proof shots behind the narration" items={[{ src: staticFile("shot.png"), title: "Proof", fit: "cover" }]} />

API Reference

PropTypeDescription
itemsBRollItem[]Image or video cards to layer. Omit for styled placeholders.
kickerstringShort label above the headline.
titlestringScene headline.
captionstringSupporting copy below the headline.
mutedbooleanMute video cards in the stack.
maxCardsnumberMaximum cards to layer.

Related