← ClaudeAtlas

remotion-best-practiceslisted

Best practices for Remotion - Video creation in React
kevinvwong/stack-agents · ★ 1 · AI & Automation · score 70
Install: claude install-skill kevinvwong/stack-agents
## 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: ```bash npx create-video@latest --yes --blank --no-tailwind my-video ``` Replace `my-video` with a suitable project name. ## Starting preview Stsrt the Remotion Studio to preview a video: ```bash npx remotion studio ``` ## Optional: one-frame render check You can render a single frame with the CLI to sanity-check layout, colors, or timing. Skip it for trivial edits, pure refactors, or when you already have enough confidence from Studio or prior renders. ```bash npx remotion still [composition-id] --scale=0.25 --frame=30 ``` At 30 fps, `--frame=30` is the one-second mark (`--frame` is zero-based). ## Captions When dealing with captions or subtitles, load the [./rules/subtitles.md](./rules/subtitles.md) file for more information. ## Using FFmpeg For some video operations, such as trimming videos or detecting silence, FFmpeg should be used. Load the [./rules/ffmpeg.md](./rules/ffmpeg.md) file for more information. ## Silence detection When needing to detect and trim silent segments from video or audio files, load the [./rules/silence-detection.md](./rules/silence-detection.md) file. ## Audio visualization When needing to visualize audio (spectrum bars, waveforms, bass-reactive effects), load the [./rules/audio-visualization.md](./ru