← Back to insights

Insight · May 5, 2026 · 9 min read

Edit Videos with Claude

Editing Videos with Claude Code + Remotion

A practical setup guide.

Hey folks,

If you found your way here, you saw the post about editing videos using Claude Code and Remotion. This is the rundown.

What we're doing is genuinely different from how most AI video tools work. Most of them apply filters or pick from a fixed library of effects. This setup is on a different track. You're using Claude Code to write actual React code, and that code compiles into your final MP4. The ceiling for what's possible is whatever React can render, which is basically anything.

The whole setup takes maybe 10 minutes if you've got Node already installed. Let's go.

What's actually happening (the mental model)

Before we touch anything, here's what's worth understanding so the rest makes sense.

Remotion is a framework that lets you build videos as React components. You write JSX that describes what should appear on each frame, and Remotion's renderer turns that into an MP4. A logo that fades in is an interpolate() call. A bouncy text reveal is a spring() helper. Captions synced to a transcript are a <Sequence> component lined up to timestamps.

Claude Code is the agentic coding tool inside Claude Desktop (or your terminal, if you prefer). When you point it at a Remotion project, it can read the existing code, write new components, drop in animations, reference your video files, and render the final output. Remotion ships with a Skills system for Claude Code that teaches it the right APIs and conventions, so it doesn't fall back on web animation patterns that break during render.

The two together = you describe an edit in plain English, Claude writes the JSX, and you get an MP4. Not a preview. The actual video file.

That's the whole mental model. Everything below is just the steps to make it work.

What you need first

  1. Node.js installed. If node -v returns a version number in your terminal, you're good. If not, grab it from nodejs.org.
  2. Claude Code access. The fastest path is the Claude Desktop app from claude.ai, which has Claude Code built in. If you prefer the terminal, you can install the CLI version. Either works.
  3. A code editor. VS Code or Cursor are fine. You don't have to write code yourself, but you'll want to peek at what Claude is doing.
  4. About 1GB of disk space for the project and dependencies.

That's it. No API keys for Remotion, no extra accounts.

Step 1: Spin up a Remotion project

Open your terminal. Run this:

npx create-video@latest

It'll ask you a few questions. The settings I'd recommend:

  • Template: Blank (you don't need the demo project clutter)
  • TailwindCSS: Yes (makes styling way easier when Claude is writing components)
  • Install Skills: Yes (this is the important one — it installs Remotion's official Skills for Claude Code, which teach Claude how to write Remotion correctly)

Pick a project name when it asks. I'll use my-video for the rest of this guide.

When it finishes, you'll have a folder with the basic Remotion setup ready to go.

Step 2: Start the preview server

In the same terminal, navigate into your project and start the dev server:

cd my-video
npm install
npm run dev

After a moment, Remotion Studio opens in your browser at http://localhost:3000. This is where you'll see your video as Claude builds it. Leave this running in the background. Anytime Claude changes the code, the preview updates live.

Step 3: Start Claude Code in the project

Open a second terminal window. Navigate to the same project folder and start Claude:

cd my-video
claude

If you're using Claude Desktop, you can also open the Claude Code panel from inside the app and point it at the my-video folder. Either way works.

Now you can prompt Claude. Try something simple to confirm everything's wired up:

Use the Remotion best practices skill. Create a 5-second
title card that says "Hello world" with a fade-in and a 
subtle gradient background.

Claude will read the skill, write the React component, and Remotion Studio will reload with the result. If you can hit play and see your title card, the setup works.

The part everyone actually wants: editing your existing videos

Creating videos from scratch is fun, but most people who saw the post want to know how to edit a video they already have. Here's the workflow.

Drop your video into the project

Inside your my-video folder, there's a public/ directory. Anything you put in there can be referenced by your Remotion components using staticFile().

So if you have a clip called intro.mp4, you'd put it at:

my-video/public/intro.mp4

That's all the file management you need to do. Claude handles the rest.

Tell Claude what to do with it

Once the file is in place, you describe the edit in plain language. Claude will write the JSX that uses <OffthreadVideo> (Remotion's component for embedding actual video files) and layer your edits on top.

A real prompt looks something like this:

Use the Remotion best practices skill.

I have a video at public/intro.mp4. It's 60 seconds long
at 30fps. Build a composition that:

1. Plays the video at full size
2. Adds an animated lower-third title that fades in at 
   2 seconds and out at 8 seconds, saying "Agentic Amit"
3. Overlays animated captions from the transcript I've 
   pasted below, with each word highlighting as it's spoken

[paste transcript here]

Use Inter font, white text with a subtle drop shadow, and 
spring animations for entrances. Keep all overlays inside 
the safe zone (200px from top and bottom).

Claude reads the file, writes the component, and Remotion Studio reloads. You watch it in the browser. If something's off, you give feedback in plain language ("the captions are too small," "fade the lower third out 1 second earlier") and Claude rewrites the relevant code.

Render the final MP4

When the preview looks right, you have two options.

From inside Remotion Studio: Click the Render button in the top-right of the preview. Pick your settings, hit go, and watch the progress bar in the Renders panel. Output lands in out/ by default.

From the terminal: Run npx remotion render and pick the composition. Same result, just from the CLI.

Either way, you get a real MP4 file.

Three prompts that produce real things

If you want a starting point, these are prompts that work and give you something useful immediately. Drop them straight into Claude with a video already in your public/ folder.

1. Animated subtitles styled per speaker

Using the Remotion best practices skill, take the video at 
public/interview.mp4 and add animated word-by-word subtitles 
based on this transcript with speaker labels: [paste]. 

Style speaker A's captions in white with a coral underline, 
and speaker B's captions in cream with a sage underline. 
Match the colors to my brand. Highlight each word as it's 
spoken using Whisper-style timing.

2. Frame-perfect data overlays from a CSV

Using the Remotion best practices skill, take the video at 
public/explainer.mp4 and overlay the data points from 
public/stats.csv as animated callouts. Each row in the CSV 
has a timestamp, a label, and a value. At each timestamp, 
fade in the label and count up the value with a spring 
animation. Position the callouts in the upper-right corner.

3. Branded intro and outro generated from a JSON config

Using the Remotion best practices skill, build a 4-second 
animated intro and a 4-second outro for the video at 
public/main.mp4. 

Read brand info from public/brand.json (it has logo path, 
brand colors, and tagline). Use the brand colors for 
backgrounds, animate the logo with a spring entrance, and 
end with the tagline. Splice the intro before the main 
video and the outro after it, then export the combined 
result.

The pattern across all three: drop the inputs in public/, describe the result you want, let Claude figure out the implementation. Iterate by giving feedback in plain language.

Where this is great and where it falls short

Honest take so you don't waste a weekend on the wrong use case.

Where it shines:

  • Motion graphics, lower thirds, animated callouts, intros and outros
  • Anything where you want consistency across many videos (build a template, run it over a batch)
  • Data-driven video (overlays from a CSV, charts that animate, dashboards as video)
  • Captions and word-level subtitles
  • Programmatic edits where the same logic applies to thousands of clips

Where it doesn't:

  • Blooper removal and loose-cut editing — you still want a timeline editor for that
  • Color grading and finicky audio sweetening
  • Anything where you're making a hundred tiny human judgment calls per minute of video
  • One-off creative edits where it's faster to drag a slider than describe what you want

The honest framing: this isn't replacing your video editor. It's giving you a way to do programmatic edits and motion graphics work that would otherwise take a weekend in After Effects. For the right use case, it's a different category of speed.

Where to go next

A few resources I'd actually recommend:

If you want a faster start, there are a few open-source kickstart repos with pre-built components, brand systems, and slash commands. Search "claude remotion kickstart" on GitHub. They're useful once you understand the basics, but I'd recommend running through this guide first so you actually understand what's happening when something breaks.

One more thing

The most underrated part of this workflow is iteration. Once you have a template that works for your style, you can run the same prompt across dozens of videos and get consistent output every time. That's the productivity gain. The first build takes work. The hundredth takes seconds.

If you build something with this, send it to me. Genuinely curious what people make.

Until next time,
Amit

Read this article as markdown