RemotionUI

Reaction Burst

A continuous side-channel of hearts and likes climbing the frame.

SceneScenes

reaction-burst30fps · 960×540
Install
$ npx remotion-ui@latest add reaction-burst

Reactions spawn on a steady cadence, climb, sway, and thin out near the top of their arc — the live-stream side channel rather than a celebration.

This is the narrow one. confetti-burst is a single impulse fired on one beat; here the stream keeps running for as long as the scene does. stopAfterSeconds closes the tap while letting everything already in flight finish its arc.

Every reaction's jitter — sway phase, lane offset, scale, tilt — is a pure function of its spawn index. Remotion renders frames out of order and in parallel, so Math.random() would give the same glyph a different arc on every frame.

Deliberately narrower than confetti-burst, which is a single impulse fired on one beat — here the reactions keep coming for as long as the scene runs. Jitter is a pure function of the spawn index, so frames render identically in any order.

Agent notes

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

Import
@/remotion/scenes/reaction-burst
  • Use when: full-frame scenes, overlays, cards, and reusable video sections.
  • Customize: reactions, ratePerSecond, align, lifeSeconds, 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 { ReactionBurst } from "@/remotion/scenes/reaction-burst"; <ReactionBurst align="right" ratePerSecond={7} />

API Reference

PropTypeDescription
reactionsstring[]Glyphs cycled through as reactions spawn.
ratePerSecondnumberReactions spawned per second.
align"left" | "right"Edge the stream rises along.
lifeSecondsnumberSeconds a single reaction takes to travel its arc.
driftnumberHorizontal sway in units, peak to peak.
sizenumberGlyph size in units at full scale.
risenumberFraction of the frame height a reaction climbs.
stopAfterSecondsnumberSeconds after which no new reactions spawn. Ones in flight finish their arc.
speednumberAnimation speed multiplier.

Related