remotion-best-practices

Domain-specific knowledge base for building videos with Remotion and React.

- Covers 30+ rule files spanning animations, audio, assets, 3D content, charts, text, transitions, and composition management

- Includes specialized guidance for captions, FFmpeg operations, audio visualization, and sound effects integration

- Provides patterns for dynamic metadata calculation, media inspection (duration, dimensions, frame extraction), and parametrizable compositions

- Supports advanced features like Lottie animations, light leak effects, Mapbox integration, TailwindCSS styling, and AI-generated voiceovers

When to use

Use this skills whenever you are dealing with Remotion code to obtain the domain-specific knowledge.

New project setup

When in an empty folder or workspace with no existing Remotion project, scaffold one using:

npx create-video@latest --yes --blank --no-tailwind my-video

Replace my-video with a suitable project name.

Designing a video

Animate properties using useCurrentFrame() and interpolate(). Use Easing to customize the timing of the animation.