home / Image & Video / Remotion Video Skill by @thatrebeccarae

Remotion Video Skill by @thatrebeccarae

FREE

github stars★ 187updatedMar 2026repo@thatrebeccarae

$git clone https://github.com/thatrebeccarae/claude-marketing

The skill is the skills/remotion-video folder inside that repository. Copy it into the folder your agent loads skills from; check your agent's documentation for where that is.

about Remotion Video Skill by @thatrebeccarae

Remotion video production best practices — spring animations, interpolation patterns, SVG draw-on effects, scene transitions, chart animations, audio integration.

our take

Best practices for making video in code with Remotion: spring animations, interpolation patterns, SVG draw-on effects, scene transitions, chart animations, audio and rendering.

when to use it

You produce videos programmatically from data or templates
You want smooth, consistent animation patterns
You render chart or explainer videos from React

before you install

Assumes you are comfortable with React and Remotion's setup
Rendering long videos takes time and compute, so test short clips first

what's inside

The original SKILL.md is organised into these sections:

Install
Core Capabilities
Spring Presets
Interpolation Patterns
Camera Zoom
Parallax Layers
Scroll Simulation
SVG Draw-On
Chart Animation Patterns
Scene Transitions
Performance Rules
Anti-Patterns

source and license

Written and maintained by @thatrebeccarae. It is published under the MIT license, which allows reuse with attribution. SkillDirectory does not claim authorship: this page adds our own review and links back to the original, and the skill's text belongs to its author.

View the full SKILL.md on GitHub ↗

Read the opening of the original SKILL.md

# Remotion Video Production

Best practices for building programmatic videos with Remotion — animations, transitions, charts, and rendering.

## Install

```bash
git clone https://github.com/thatrebeccarae/claude-marketing.git && cp -r claude-marketing/skills/remotion-video ~/.claude/skills/
```

## Core Capabilities

- Spring animation presets (bouncy, smooth, crisp, staggered)
- Interpolation patterns (camera zoom, parallax, scroll simulation)
- SVG draw-on animations (path tracing, stroke reveal)
- Scene transitions via TransitionSeries
- AbsoluteFill layering for compositing
- Chart animations (bar grow, line draw-on, pie reveal, count-up numbers)
- Audio integration and sync
- Rendering configuration

## Spring Presets

Use `spring()` from Remotion for physics-based animations:

| Preset | Config | Use Case |
|--------|--------|----------|
| Bouncy | `mass: 0.5, damping: 8, stiffness: 120` | Playful reveals, logo bounces |
…

Excerpt only, quoted from the author's repository. Open the repository for the complete file.

↓ download .zip