remotion-create · openai — Codex skill: what it does, how to install
Scaffolds Remotion video projects in Codex, sets up React compositions, and launches live preview via Remotion Studio.
npx skills add openai/plugins --skill remotion-create -a codexWhat remotion-create does
The skill initializes blank projects using npx create-video@latest --yes --blank --no-tailwind and installs dependencies. It guides React markup structure, multi-scene video layouts, and interactive Studio properties that write changes back to code. It also accommodates TailwindCSS when requested.
Once components are configured, it runs npx remotion studio --no-open to start the preview server. Codex then opens the local composition URL directly in its in-app browser.
Without Node.js and Git installed in the system, scaffolding will fail immediately. Video rendering with npx remotion render remains paused until you explicitly ask for export.
What it helps with
- scaffold a blank Remotion project
- structure React compositions for multi-scene video
- launch Remotion Studio preview server in headless mode
- inspect video frames inside the Codex in-app browser
Example prompts for the agent
- Create a new Remotion project named promo-clip
- Start the Remotion Studio preview for my composition
- Render the final video
How to install remotion-create
1Skills CLI (Vercel)
npx skills add openai/plugins --skill remotion-create -a codex2Manually: put the files in place
.agents/skills/remotion-create/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add openai/plugins --skill remotion-create -a claude-code2Manually: put the files in place
~/.claude/skills/remotion-create/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/remotion-create/
Manually: put the files in place
.cursor/skills/remotion-create/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install openai/plugins remotion-create2Manually: put the files in place
.github/skills/remotion-create/SKILL.mdPlatform CLI
gemini skills install https://github.com/openai/plugins --path plugins/remotion/skills/remotion-createManually: put the files in place
.devin/skills/remotion-create/SKILL.mdThe legacy .windsurf/skills/ path still works
Claude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: Codex skills: how to install, where they live, how to call them
Questions about remotion-create
How to install remotion-create in Codex?
Run npx skills add openai/plugins --skill remotion-create in your terminal.
What does remotion-create do?
It scaffolds a Remotion React project, sets up video compositions, and previews them inside Codex.
Does the skill render videos automatically?
No. The npx remotion render command runs only when you explicitly ask to export the video.
Source text
SKILL.md · MIT
--- name: remotion-create description: Create a new Remotion video version: 4.0.506 --- 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. ## 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? If this is a video with multiple subsequence videos, follow guidance at [Multi-scene videos](../remotion-markup/multi-scene-video.md). ## Interactivity Best Practices By structuring the React Markup following [Remotion Interactivity Best Practices](../remotion-interactivity/SKILL.md), you allow the user to make edits in the Studio which write back to code. ## TailwindCSS If Tailwind is requested, see [tailwind.md](tailwind.md) for using TailwindCSS in Remotion. ## Open the preview After creating or updating the video, start the preview server by default: ```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. Open the exact URL in the Codex in-app browser. If no browser tool is available yet, use `tool_search` for the in-app browser control tool, then navigate to the local URL. You can visit a specific composition by navigating to `/[composition-id]`, for example `http://localhost:3000/MapAnimation`. ## Render the video Only render if the user explicitly asks for it. ``` npx remotion render ``` For more options, see [Rendering](../remotion-render/SKILL.md). ## Follow-up The video creation process has finished. For follow-up prompts, use [Remotion Best Practices](../remotion-best-practices/SKILL.md)
© Remotion · MIT · openai/plugins
Similar skills
All skills for Frontend and UI →remotion-create by other authors comes first.