Does it support TailwindCSS?

Yes. If Tailwind is requested, the skill points to tailwind.md for using TailwindCSS in Remotion.

Does it render the video automatically?

No. It renders only if the user explicitly asks for it, using npx remotion render.

What do I need before scaffolding a project?

Node.js and Git must be installed, and the current folder must be appropriate for starting a new project.

How do I preview a specific composition?

Navigate to /[composition-id] on the Studio server, for example http://localhost:3000/MapAnimation.

remotion-create

SkillMedia

The remotion-create skill lets an AI agent scaffold a new Remotion video project and build the video by writing React markup. It covers project setup, starting the Remotion Studio preview in the browser, layout and interactivity guidance, and rendering the final video when asked. It is meant for the moment a new video is being created, not for later edits.

Connect your AI Use it in a pipeline

Then ask your AI: use the remotion-create skill

Details

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

Account requirements not reviewed. Check the skill instructions before use; Ahel provides instructions and does not run this skill.

No other account needed.

Make sure Node.js and Git are installed and the current folder is right for a new project.

What your AI can do with it

Scaffold a new Remotion project with create-video
Start Remotion Studio and print the preview URL
Open a specific composition by its id in the browser
Add React markup to design the video
Follow layout, multi-scene, and interactivity guidance
Render the video with npx remotion render when asked

Getting started

Make sure Node.js and Git are installed and the current folder is right for a new project.
If no project exists, scaffold one with npx create-video@latest --yes --blank --no-tailwind my-video, then cd into it and run npm i.
Start the preview with npx remotion studio and keep it running while you work.
Add React markup to the composition, following the layout and interactivity guidance.
Render the video with npx remotion render only when the user explicitly asks for it.

What this skill tells your AI

The instructions your AI receives, as published by remotion-dev/remotion in packages/codex-plugin/skills/remotion-create/SKILL.md and read by Ahel’s review.

These are instructions for making a new Remotion project and composition. If this is not the next task, see Remotion Best Practices

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:

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:

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:

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 and Video Layout Rules 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.

Interactivity Best Practices

By structuring the React Markup following Remotion Interactivity Best Practices, you allow the user to make edits in the Studio which write back to code.

TailwindCSS

If Tailwind is requested, see tailwind.md for using TailwindCSS in Remotion.

Render the video

Only render if the user explicitly asks for it.

npx remotion render

For more options, see Rendering.

Follow-up

The video creation process has finished. For follow-up prompts, use Remotion Best Practices

Signals

GitHub stars: 63k
Forks: 5k
Last commit: Oct 2026

Questions

Does it support TailwindCSS?: Yes. If Tailwind is requested, the skill points to tailwind.md for using TailwindCSS in Remotion.
Does it render the video automatically?: No. It renders only if the user explicitly asks for it, using npx remotion render.
What do I need before scaffolding a project?: Node.js and Git must be installed, and the current folder must be appropriate for starting a new project.
How do I preview a specific composition?: Navigate to /[composition-id] on the Studio server, for example http://localhost:3000/MapAnimation.

Advanced

Item type: skill
Key: remotion-create-3
Source: github.com/remotion-dev/remotion

github.com/remotion-dev/remotion