Audio Visualization

RemotionUI audiogram components use @remotion/media-utils for frame-accurate spectrum data.

Install

npx remotion-ui add audiogram-scene

Usage

import { AudiogramScene } from "@/remotion/scenes/audiogram-scene";
import { staticFile } from "remotion";

<AudiogramScene src={staticFile("podcast.wav")} title="Episode 1" />;

Tips

• Pass audio src as staticFile() or a remote URL
• Use useWindowedAudioData via audio-viz-utils for custom visualizations
• When nesting in <Sequence>, pass frame from parent — do not call useCurrentFrame() in each bar child

See audiogram-bars and audiogram-scene.