How to Install Remotion Agent Skills for Claude Code, Codex, and Cursor

Remotion maintains Agent Skills — instruction files that define best practices for working in Remotion projects. They are meant for coding agents such as Claude Code, Codex, Kimi Code, Cursor, and OpenCode, so those tools can create projects, write markup, open Studio, and render from documented practice instead of improvising.

This is a setup guide from Remotion’s own pages: install the skill bundle, see where it lands, pick a skill by name, then stand up a blank project and start prompting.

What you need

Install a coding agent first — Claude Code, Codex, Kimi Code, or OpenCode — and Node.js. Remotion notes that most coding agents require a paid subscription.

You can add skills to an existing Remotion repo, or create a new project and install them as part of the first-run flow.

Install the skills

Remotion documents two install commands that pull from remotion-dev/skills.

From a project directory, add the maintained bundle:

npx skills add remotion-dev/skills

If you already have the Remotion CLI available in the project, use the dedicated subcommand:

npx remotion skills add

The CLI entry point is npx remotion skills <subcommand>. The documented subcommands are add (install) and update (refresh the same bundle):

npx remotion skills update

When you scaffold a new Remotion project with Bun, Remotion also offers the option to add skills during create:

bun create video

Use whichever path matches how you started the repo. npx remotion skills add is the command Remotion uses in its coding-agents walkthrough after npm install.

Where the files go

Skills install into the .agents/skills directory in your project. Claude Code compatibility is a symlink: .claude/skills points at .agents/skills. You do not keep a second copy for Claude.

That layout is enough for the agents Remotion lists. After install, the next decision is which named skill to invoke.

The skill catalog

Each skill is a named playbook. If you are not sure which one to use, start with /remotion-best-practices — Remotion says this skill encompasses all the others.

/remotion-create — create a new Remotion project or composition. Remotion’s example prompt is to make a promo video for a record store.
/remotion-markup — best practices for Remotion React markup: compositions, animations, layout, typography, media elements, effects, audio, fonts, and timing. Example: create an animated title card using Inter.
/remotion-studio — launch Studio to preview the video.
/remotion-render — render a video or a still.
/remotion-maps — map animations: static maps, animated routes and markers, geographic explainers, Mapbox, MapLibre, MapTiler, GeoJSON, and 3D geographic flyovers with CesiumJS. Example: animate a route from Los Angeles to New York and make the camera follow it.
/remotion-captions — captions and subtitles.
/remotion-saas — architecture guidance for Remotion-powered apps and product integrations. Example: turn a video into a SaaS.
/remotion-interactivity — make Remotion code editable in Studio when elements are not selectable or editable the way you want.
/remotion-docs — search the Remotion documentation and fetch any page as Markdown. Use this to look up current API references, component props, and package guides before implementing. Example: how to set up Remotion Lambda?
/remotion-upgrade — upgrade Remotion, related packages, compatible Mediabunny packages, and installed Remotion Agent Skills.
/remotion-multimedia — browser-based multimedia handling with Mediabunny, including how to get video and audio metadata.

Point the agent at a specific skill when the task is obvious. Fall back to /remotion-best-practices when the work spans several of those areas, and use /remotion-docs when you need a current page rather than a remembered API.

New project, then skills, then the agent

Remotion’s coding-agents tutorial is the shortest path from zero to a promptable preview. You can create videos from prompting once the project, skills, and Studio preview are running.

Create a Blank project:

npx create-video --yes --blank my-video

That writes a Blank template into the my-video directory. Move into it:

cd my-video

Install dependencies:

npm install

Install the Agent Skills:

npx remotion skills add

Start the preview:

npm run dev

Leave that process running. In a second terminal, start the agent from the same project:

cd my-video
claude

Remotion documents codex, kimi, or opencode as alternatives to claude in that same step. Once the agent is up, you can prompt a video. The coding-agents page also includes a five-minute beginner video, Create motion graphics with AI, if you want prompt ideas before you type.

Keep skills current

When you want the installed files refreshed from remotion-dev/skills, run:

npx remotion skills update

You can also have the agent use /remotion-upgrade, which covers Remotion itself, related packages, compatible Mediabunny packages, and the installed Agent Skills.

Next step

Run the blank-project sequence above — npx create-video --yes --blank my-video, npm install, npx remotion skills add, npm run dev — then start claude, codex, kimi, or opencode in a second terminal and invoke /remotion-best-practices on a concrete brief: a title card, a short promo, or a mapped route. Read the full catalog on Remotion’s Agent Skills page if you would rather target /remotion-markup or /remotion-render directly.