Remotion skill: make videos in React with Claude Code and other agents

Source: remotion-dev/skills · Maintainer: Remotion · License: Not stated (no LICENSE file in remotion-dev/skills; the Remotion monorepo it is generated from uses the Remotion License) · Checked: 24 October 2026

What is the Remotion skill?

The Remotion skill, remotion-best-practices, teaches your coding agent to make videos in React with Remotion: scaffold a project, write frame-driven animation markup, preview it in Remotion Studio and render it to a file when you ask. It is for developers who want to describe a promo, explainer or data video in plain language and have Claude Code, Codex or Cursor build it as code.

It is the main skill in remotion-dev/skills, which Remotion maintains. The repo README says of it: "This skill encompasses all other skills. Use it if you are not sure which specific skill to use." The SKILL.md description is short: "Router for all Remotion skills".

As of 24 October 2026, its skills.sh page listed about 672,600 installs (snapshot, 24 October 2026).

What does it do?

The SKILL.md is a router. It gives a few standing rules, then points the agent to the right bundled guide for the task. The standing rules:

• Preserve user changes. If the agent finds a surprising edit made outside the conversation, it should assume it was intentional or ask, not overwrite it.
• Preview, don't render. When you ask it to make a video, the agent starts Remotion Studio with npx remotion studio and opens the preview as soon as the project runs, so you can watch and steer. It renders with npx remotion render only when you are explicit, such as "Render the video", "Export" or "Give me the MP4".

The bundled guides, each a REFERENCE.md in its own subfolder:

The markup guide carries the rules that matter most for video. Drive animation with useCurrentFrame() and interpolate(), because, in the guide's words, "CSS transition or animation will not render correctly". Take fps from useVideoConfig() for every seconds-to-frames calculation, put assets in public/ and load them with staticFile(), and use <Video> and <Audio> from @remotion/media.

The folder also holds Codex display metadata (agents/openai.yaml), icons, and for the maps guide, sample data, example components and two Node scripts for preparing geographic data. The repo lists the same guides as 11 separate skills too, such as remotion-markup and remotion-render, for people who want only one.

How do you install the Remotion skill?

skills.sh lists this command for the skills CLI:

npx skills add https://github.com/remotion-dev/skills --skill remotion-best-practices

Remotion's Agent Skills docs give three ways to get the whole set:

npx skills add remotion-dev/skills
gh skill install remotion-dev/skills
bun create video

The last one is Remotion's project creator, which offers to add the skills when you start a new project. Add -g to the skills CLI command to install for every project. For Claude Code, the skill lands in .claude/skills/remotion-best-practices/, or ~/.claude/skills/remotion-best-practices/ with -g, the standard Claude Code skill locations. Remotion's docs say the skills "are useful for AI agents like Claude Code, Codex, Kimi Code or Cursor"; see Codex skills and Cursor skills for how those agents load the same SKILL.md format.

Keeping it current. The skill is versioned with Remotion (4.0.538 when checked). The upgrade guide says npx remotion upgrade "also updates project-local Remotion skills"; without the Remotion CLI, npx skills update with the skill names does the same.

How do you use it?

Start with what you want to see, and let the agent open the preview.

Example prompts (suggestions; the first two adapt examples from Remotion's README):

• "Make a promo video for a record store."
• "Animate a route from Los Angeles to New York and make the camera follow it."
• "Turn this CSV of monthly signups into a 20-second animated bar chart, 1080 by 1920 for social."
• "Add captions to intro.mp4, transcribed locally, with the current word highlighted."
• "The video looks right in Studio. Render it to MP4."

Requirements: Node.js and Git, per the create guide, and a Remotion project, which the skill can scaffold. Some guides add packages or services: captions use @remotion/whisper-webgpu, the voiceover guide uses ElevenLabs, and Mapbox maps need a Mapbox access token.

Tips and limits

• Check Remotion's license. The skills repo has no LICENSE file. Remotion itself is under the Remotion License: free for individuals, for-profit organizations with up to 3 employees, non-profits and evaluation; other companies need a Company License. The skill is for building with Remotion, so check those terms before you use it at work.
• Commands run. The skill tells the agent to run npx remotion studio, npx remotion render, npx create-video and package installs. Approve them as you would any build step.
• Security audit. As of 24 October 2026, its skills.sh page showed Warn from Gen Agent Trust Hub (risk level medium, audited 22 October 2026) and Pass from Socket and Snyk. The Warn notes a hardcoded Algolia search key and app ID in the docs guide, fetching media from user-provided URLs without guidance on embedded instructions, downloads from map providers, and CLI command execution.
• Scripts. The two map scripts, prep-geo.mjs and prep-cesium-path.mjs, turn a GeoJSON line into map data or a camera path (the Cesium one defaults to a bundled sample river). They only run if the agent uses them for map work.
• Context size. The router keeps the first load small and pulls in a guide only when needed, but the markup guide alone holds 33 topic files. Point the agent at the relevant topic for narrow fixes.

Save it in your Kipt library

Kipt can import a skill when you paste its GitHub folder link into Skills, but skip the import for this one. The skills repo states no license, so Remotion hasn't granted the right to copy it, and the skill is versioned with Remotion and updated by npx remotion upgrade, which a copy would miss. Install it from Remotion's repo with the commands above. Kipt is a better home for video prompts and skills you write yourself: they live in your own private GitHub repo and install into Claude Code or Codex with one command:

npx skills add https://github.com/<you>/<repo>.git --all -g

Kipt is not affiliated with Remotion.

Similar skills

• HyperFrames slideshow skill: HeyGen's skill for live HTML decks, from a framework that also renders HTML to video.
• Emil Kowalski skill: easing, springs and timing rules that carry over to motion design in video.
• React best practices skill: Vercel's React performance rules, useful when a Remotion composition gets heavy.