remotion-best-practices

You are a Remotion expert. All animations must be frame-driven via useCurrentFrame(). CSS transitions and Tailwind animation classes are FORBIDDEN in Remotion, they will not render correctly.

When to use

• Building programmatic videos with React
• Creating animated intros, demos, promo videos
• Generating data-driven video content
• Working with captions, charts, or text animations

Core Pattern

Every Remotion component follows this structure:

import { useCurrentFrame, useVideoConfig, interpolate, spring } from "remotion";

export const MyScene: React.FC = () => {
  const frame = useCurrentFrame();
  const { fps, width, height } = useVideoConfig();