# Remotion Video

Creates a new Remotion video project.

- Repository: https://github.com/remotion-dev/remotion (69731 stars)
- Category: Media
- License: see repository
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add remotion-dev/remotion --skill remotion-create -g -a claude-code -y`
Codex: `npx skills add remotion-dev/remotion --skill remotion-create -g -a codex -y`
Cursor: `npx skills add remotion-dev/remotion --skill remotion-create -g -a cursor -y`
Gemini CLI: `npx skills add remotion-dev/remotion --skill remotion-create -g -a gemini-cli -y`

## Description

Create a new Remotion video

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

These are instructions for making a new Remotion project and composition.  
If this is not the next task, see [Remotion Best Practices](../remotion-best-practices/SKILL.md)

## Scaffold a project

If a project already exists, skip this.
Ensure Node.js and Git is installed, and the current folder is appropriate for starting a new project.

Scaffold one using:

```bash
npx create-video@latest --yes --blank --no-tailwind my-video
cd my-video
npm i
```

Replace `my-video` with a suitable project name.

## Open the preview before building the video

As soon as the project can run, start Studio and open its preview in the browser before writing or changing the composition. For a new project, do this immediately after scaffolding and installing dependencies. For an existing project, do it before editing the video. Keep Studio running while you work so the user can see changes and steer.

In Cursor, run Studio without `--no-open` so it opens the browser automatically:

```bash
npx remotion studio
```

In other agent clients, you can use the same command, or use `--no-open` if you will open the URL in an in-app browser:

```bash
npx remotion studio --no-open
```

This will start a long-running process and print the server URL for the preview.
If the server is already started, it will print the URL.
If you use `--no-open`, open the exact printed URL in the in-app browser and verify that Studio loads. Once a composition exists, verify that its video preview loads. If you cannot open it there, run Studio without `--no-open`.
You can visit a specific composition by navigating to `/[composition-id]`, for example `http://localhost:3000/MapAnimation`.

## Designing a video

Keep the scaffold and add React Markup.
Follow [Remotion React Markup Best Practices](../remotion-markup/SKILL.md) and [Video Layout Rules](video-layout.md) for video-first layout and text sizing guidance.

## Is this a multi-scene video?

The rest: https://github.com/remotion-dev/remotion/blob/HEAD/packages/codex-plugin/skills/remotion-create/SKILL.md
