Remotion Agent Skills: What They Are and How to Install Them

What Remotion agent skills are

Remotion agent skills are official instruction files from the Remotion team that tell a coding agent how to work in a Remotion project. Remotion’s docs describe them as a set of Agent Skills that define best practices, useful for agents such as Claude Code. The files are public in the remotion-dev/skills repository on GitHub.

Each one is a skill in the usual sense: a folder with a SKILL.md file that opens with a short YAML header, a name and a description, followed by instructions in Markdown. What is a Claude skill? explains the general idea. For Remotion, three points matter:

• Same format as Claude Code skills. Claude Code’s docs say its skills follow the Agent Skills open standard, which works across several AI tools. Remotion’s skills use that format, so one set serves Claude Code and other coding agents.
• Loaded when needed. Claude keeps only each skill’s short description in view until a request matches it. Then it reads the full instructions, and any extra files only if those instructions point to them.
• A router plus specialists. remotion-best-practices is mostly a router. It sends Claude to the reference file that fits the task, such as markup, maps, captions or Studio interactivity.

The reason to bother is accuracy. Remotion’s AI docs present the skills as a way to give coding agents current Remotion guidance. Its own guide to generating Remotion code with a language model says that a prompt relying only on the model’s existing knowledge of Remotion is not ideal, just a starting point.

How to install Remotion agent skills

You can install the skills into one project with a single command, more widely with the open skills tool, or as a Claude Code plugin. Pick one route; you do not need all three.

Inside a Remotion project. From the project folder, run:

npx remotion skills add

Remotion’s CLI reference says this installs the skills into .agents/skills inside your project, and that Claude Code compatibility comes from a .claude/skills link pointing to that folder. Refresh them later with npx remotion skills update.

With the skills command. Remotion’s skills page publishes this command:

npx skills add remotion-dev/skills

It runs an open-source command-line tool for agent skills. Its README says you choose which skills and which coding agents to install to, that skills go into the current project by default, and that adding -g makes them available across projects. Remotion’s installation page also offers a short prompt to paste into a coding agent. It asks the agent to make sure Node.js is installed, run npx -y skills@latest add remotion-dev/skills -g -y, and then use the skills to create a video.

As a Claude Code plugin. Remotion maintains a plugin that includes the same skills. In the Claude desktop app, select Code, open Customize in the sidebar, then Plugins and Discover. Search for remotion and click Add. From a terminal, Remotion’s docs give two commands:

claude plugin marketplace add remotion-dev/claude-code-plugin
claude plugin install remotion@remotion

Restart Claude Code afterwards. Plugin skills carry the plugin’s name as a prefix, so the create skill is called as /remotion:remotion-create.

When you start a new project. The npx create-video@latest wizard asks whether to install Agent Skills while you pick one of the Remotion templates. Claude Code + Remotion walks through that setup from an empty folder.

To check that the install worked, start Claude Code in the project and type /. The Remotion skills should be in the list.

What each Remotion skill covers

Remotion’s docs list twelve skills, and the router skill covers all of them, so most of the time you can let Claude choose.

• /remotion-best-practices: the umbrella skill, for when you are not sure which one applies.
• /remotion-create: starts a new Remotion project or composition.
• /remotion-markup: how to write the React markup, including compositions, animation, layout, typography, media, effects, audio, fonts and timing.
• /remotion-studio: opens Studio so you can preview the video.
• /remotion-render: renders a video or a still.
• /remotion-captions: captions and subtitles.
• /remotion-maps: map animations, from static maps to animated routes, markers and 3D flyovers.
• /remotion-interactivity: shapes the code so elements can be selected and edited in Studio.
• /remotion-docs: searches the Remotion documentation and fetches any page as Markdown.
• /remotion-upgrade: upgrades Remotion, related packages and the installed skills.
• /remotion-multimedia: media handling in the browser, such as reading a video’s metadata.
• /remotion-saas: architecture advice for apps and products built on Remotion.

Remotion transitions are covered inside the markup skill. Its transitions file explains <TransitionSeries>: a transition such as a fade, slide or wipe plays both scenes at once and shortens the timeline, while an overlay such as a light leak sits on the cut without shortening it. The captions skill asks for captions as JSON in the Caption type from @remotion/captions, with separate guides for transcribing video and audio, displaying captions and importing .srt files.

To call a skill yourself, type its name followed by your request. This is one of Remotion’s own example prompts:

/remotion-markup Create an animated title card using Inter.

How the skills change what Claude writes

The skills mostly change small technical choices that decide whether the render matches what you asked for. Reading the SKILL.md files on GitHub shows the kind of rules they add:

• Motion from the frame number. The markup skill tells the agent to drive animation with useCurrentFrame() and interpolate(). It warns that CSS transition and animation, and Tailwind animation classes, will not render correctly.
• Timing from the frame rate. Seconds are converted to frames using the fps value from useVideoConfig(), so timing stays correct if the frame rate changes, and Studio can still edit it.
• Preview before render. When you ask for a video, the router skill tells the agent to open the Studio preview as soon as the project runs and keep it open while it works, and not to render unless you clearly ask.
• Your edits survive. Both the router and the markup skill tell the agent that a surprising change in the code was probably made by you on purpose, so it should keep it or ask first.

None of this replaces a clear brief. The skills tell Claude how to build in Remotion. Your prompt still decides what the video says, how long each scene holds and how it looks.

One caution applies to every skill, official or not. Anthropic’s skills documentation advises using skills only from trusted sources and auditing what you install, because a skill can direct Claude to run code. Remotion’s skills are plain Markdown files, so you can read them on GitHub before installing.

Remotion skills and editing skills for filmed footage

Remotion’s skills and this site’s editing skills use the same format for different jobs. Remotion’s skills teach Claude to build designed video from code. The AI Video Effects are editing styles packaged as Claude Code skills for your own recording: Claude cuts it, captions it and adds graphics with ffmpeg and Python, not Remotion.

The two kinds can live side by side in one Claude Code setup. Each skill’s description tells Claude when it applies, so a request for an animated map loads Remotion’s guidance, and a request to edit your talking-head clip loads the editing style.

Where to start

Start with one Remotion project and the official skills. Create the project, run npx remotion skills add, open Claude Code and ask for one short scene. Watch it in Studio, write two or three notes and render when the timing is right.

If your videos are mostly you talking to camera, Remotion is the wrong starting point. Run the free setup prompt in a new folder instead. It prepares word timestamps and a person mask that the free effects build on. Once a few effects work, the Combine & Fix workflow ends by saving your whole setup as a Claude Code skill of your own.