Render with Remotion CLI
npx remotion render remotion/index.tsx CelebrationBurst output.mp4
Composition code
import { AbsoluteFill, useCurrentFrame, interpolate, Easing } from "remotion";
function seededRand(seed: number) {
return (Math.sin(seed + 1) * 43758.5453123) % 1;
}
const COLORS = ["#f59e0b", "#6366f1", "#ec4899", "#22c55e"];
export const CelebrationBurst: React.FC = () => {
const frame = useCurrentFrame();
const trophyScale = interpolate(frame, [5, 35], [0, 1], { extrapolateLeft: "clamp", extrapolateRight: "clamp", easing: Easing.out(Easing.back(1.5)) });
const textOpacity = interpolate(frame, [30, 55], [0, 1], { extrapolateLeft: "clamp", extrapolateRight: "clamp" });
Celebration Burst
Achievement unlock animation with particle confetti explosion, bouncing trophy emoji, and gradient text reveal.
Duration6s
Resolution1080 × 1080
Frame rate30 fps
Frames180
Copy the code snippet into your Remotion project and run the render command to generate this template locally.
