About remotion-studio
A skill for using Remotion Studio during video creation or editing, aimed at workflows where a user can inspect and guide changes through a live preview.
Key features
- 01Start Remotion Studio
- 02Open or reuse the Studio preview
- 03Choose browser-opening behavior
- 04Set logging and port options
- 05Launch an additional Studio instance
Use cases
- 01Preview a video composition while building it
- 02Let a user guide edits through the live Studio view
Install
Copy the command and run it in a terminal.
npx skills add https:/ / github.com/ remotion-dev/ skills --skill remotion-studioAfter installing, type/remotion-studioin Claude Code to confirm it loaded.
Bundled filesagents/openai.yamlassets/remotion-icon.svg
Details
From the project READMEWhen creating or editing a video, start Studio and open its preview as soon as the project can run, before building the composition. Keep it open while you work so the user can see changes and steer.
In Cursor, run Studio without --no-open so the browser opens automatically:
npx remotion studio
In other agent clients, you can also let Studio open the browser automatically with the command above. If you have an in-app browser and intend to use it, run:
npx remotion studio --no-open
If the Studio is already opened, the URL will be printed and the command will exit. Otherwise, a long-running process will start, and the URL will be printed.
When using --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. Do not use --no-open if you cannot open the URL in the in-app browser.
Useful flags
| Argument | Purpose |
|---|---|
--log=<level> | Set error, warn, info (default), or verbose logging. |
--port=<number> | Request a Studio server port; otherwise Remotion finds a free port. |
--force-new | Start another Studio instance even when one is already running for the same project and port. |