skills / remotion-dev / skills / remotion-best-practices

Remotion Best Practices

Current Remotion agent skill source with install verification and rules for project setup, composition design, media handling, captions, FFmpeg, effects, timing, and render checks.

Source description: Best practices for Remotion - Video creation in React

Need the remotion-best-practices install command?

Copy the npx command below to install this OpenClaw skill. This page also includes the original SKILL.md source, required permissions, verification notes, rollback triggers, and common setup fixes.

npx skills add https://github.com/remotion-dev/skills --skill remotion-best-practices
risk: mediuminstall: CLIverified: 2026-07-06

On this page

Our added value (verification layer)

This page is not only a source mirror. We add reproducibility, risk controls, and operations guidance on top of the original skill definition.

  • Execution/Security/Maintainability scoring with explicit criteria
  • Compatibility matrix across runtime environments
  • Verification log with check commands and observed outcomes
  • Common failure fixes and rollback triggers for production safety

Overall score

81/100

Execution

84

Security

77

Maintainability

82

Install remotion-best-practices

Copy the source-specific Skills CLI command:

npx skills add https://github.com/remotion-dev/skills --skill remotion-best-practices

Verification steps used for this page:

  1. npx -y skills add https://github.com/remotion-dev/skills --skill remotion-best-practices -y -g
  2. test -f ~/.agents/skills/remotion-best-practices/SKILL.md
  3. wc -lc ~/.agents/skills/remotion-best-practices/SKILL.md
  • Confirm the installed source exists before debugging task behavior.
  • Review the current SKILL.md and referenced rule files before applying the skill to a production Remotion project.

SKILL.md (source preview)

Short preview shown here to keep this page focused on our verification layer.

When to use Use this skills whenever you are dealing with Remotion code to obtain the domain specific knowledge. New project setup When in an empty folder or workspace with no existing Remotion project, scaffold one using: Replace my video with a suitable project name. Designing a video Before designing visual scenes, layouts, promos, motion graphics, or text heavy videos, load [rules/video layout.md](rules/video layout.md) for video first layout and text sizing guidance. Ani...

View full SKILL.md source page →

Required permissions

file, shell

Compatibility matrix

EnvironmentStatusNotes
Skills CLI global installpassCanonical installer command completed on 2026-07-06 and refreshed the local source.
OpenClaw skill pathpassVerified ~/.openclaw/skills/remotion-best-practices resolves to the installed universal source.
Remotion project behavior runpartialCurrent source was inspected and synced; no end-to-end Remotion render task was executed in this verification cycle.

Verification log

Canonical install command executed

npx -y skills add https://github.com/remotion-dev/skills --skill remotion-best-practices -y -g

Pass

result: pass

Canonical source exists locally

test -f ~/.agents/skills/remotion-best-practices/SKILL.md

Pass

result: pass

OpenClaw skill path resolves

test -e ~/.openclaw/skills/remotion-best-practices && readlink ~/.openclaw/skills/remotion-best-practices

Pass

result: pass

Current source size recorded

wc -lc ~/.agents/skills/remotion-best-practices/SKILL.md

Pass

result: pass

Frontmatter description + full body synced

split current local SKILL.md frontmatter from body and persist exact source fields

Pass

result: pass

Security notes

  • Review the current SKILL.md and referenced rule files because the skill can direct project and shell-level workflows.
  • Treat FFmpeg, external media inputs, and remote asset URLs as separate trust boundaries.
  • Do not infer production safety from successful installation alone; no end-to-end Remotion render was executed in this verification cycle.

Common failures and fixes

Skill source looks much shorter than current documentation

Reinstall from the canonical remotion-dev/skills repository and compare the local SKILL.md before debugging behavior.

Animation works in the browser but not in a Remotion render

Follow the source rule to use frame-driven Remotion animation instead of CSS transitions or Tailwind animation classes.

Specialized task guidance is missing

Load the referenced rule file for captions, FFmpeg, effects, timing, maps, voiceover, or the relevant media task.

Quick FAQ

How do I install this skill quickly?

Run the npx skills add command shown above, then verify the installed SKILL.md exists. This page does not assume a universal restart requirement.

What should I check before production rollout?

Confirm permissions, run a non-destructive dry run, and review rollback triggers.

What if install succeeds but actions do not run?

First verify the installed source path and current SKILL.md, then separate installation from agent routing, project dependencies, and Remotion-specific runtime behavior.

Recent changes

  • 2026-07-06: Re-ran the canonical installer and refreshed the full local SKILL.md source.
  • 2026-07-06: Expanded the stored source from the older short snapshot to the current 364-line source body.
  • 2026-07-06: Replaced generic restart/dry-run claims with observed install-path and source-verification evidence.

Rollback triggers

  • Video output quality regresses after composition refactor.
  • Render times spike beyond acceptable CI/CD limits.
  • FFmpeg pipeline changes introduce unstable or nondeterministic outputs.

Known issues

The current SKILL.md references many supporting rule files

Treat the referenced rule files as part of the usable source surface for specialized tasks.

Installer completed for supported agents but reported a PromptScript global-install limitation

Use the verified OpenClaw path for this page and do not generalize the install result to every agent runtime.

No end-to-end Remotion render was executed in this verification cycle

Run a project-specific preview or render check before claiming workflow success.

Related tutorials

Site references