remotion-dev/remotion
20 skills9.3k installs988k starsGitHub
Install
npx skills add https://github.com/remotion-dev/remotionSkills in this repo
1Web Renderer Testweb-renderer-test is an agent skill for contributors and solo builders extending Remotion’s browser renderer. It explains where the web renderer and test suite live, how to run a single Vitest file (for example bunx vitest src/test/video.test.tsx), and how each test is driven by a typed fixture under packages/web-renderer/src/test/fixtures. Fixtures export a Remotion composition with dimensions, fps, and duration; tests call renderStillOnWeb to produce a still image blob and assert against baselines via testImage. The pattern is repeatable for new compositions without ad-hoc screenshot tooling. Use it when you are patching renderer behavior and need regression coverage that matches the repo’s existing visual snapshot discipline rather than inventing a parallel test harness.1.3kinstalls2Writing DocsWriting Docs is a Remotion-maintainer skill for solo builders and contributors who document programmatic video APIs in the official docs site. It tells your agent exactly how new pages land in packages/docs as MDX, how to register them in sidebars.ts, when to set crumb for package breadcrumbs, and why every public function deserves its own page with property-level headings instead of bullet dumps. Invoke it when you are extending @remotion packages, fixing doc drift, or preparing release notes that must match site conventions—including generating social preview cards via bun render-cards.ts. The rules reduce review churn for Remotion-style doc PRs and keep AI-written pages aligned with their style guide. It is not a general technical-writing course; scope stays Remotion MDX, public surfaces, and their heading hierarchy. Pair it with your normal PR workflow after the MDX draft exists.1.3kinstalls3Video ReportVideo-report is a Remotion maintainer-facing agent skill for when someone says a video is not working. Instead of theorizing in chat, the agent places the reported URL as the src in packages/example/src/NewVideo.tsx, then runs bunx remotion render NewVideo --log=verbose inside packages/example. That gives you a concrete, log-heavy render attempt aligned with how the Remotion team debugs regressions. Solo builders shipping programmatic video (marketing clips, data visualizations, or SaaS exports) can adapt the same pattern: one canonical example composition plus verbose CLI output. It is not a general media CDN debugger—it assumes a Remotion workspace and the example package layout. Use it during Ship when you need evidence from the renderer, not just browser playback guesses.1.2kinstalls4Docs DemoDocs-demo is a Remotion monorepo contributor skill for adding interactive examples to the official documentation. Demos render compositions inline via @remotion/player and are wired through a typed registry in packages/docs/components/demos/. The agent creates a React demo component, exports a DemoType object with canvas size, fps, duration, autoplay, and optional UI options, then registers it in the central demos array before referencing it from MDX with a type id. Effect showcases follow a parallel path: EffectsDemo with entries in effects-demos/registry.ts tied to real effect schemas rather than the generic Demo options array. Solo builders hacking on Remotion forks or internal video-doc sites can reuse the same pattern for teachable, runnable snippets. Use it when a docs page needs motion that readers can scrub and tweak, not a static screenshot.1kinstalls5Add ExpertAdd Expert is a narrow agent skill for contributors maintaining the official Remotion repository who need to publish a new freelancer on the Remotion experts page without missing asset paths or data shape mistakes. It is not a general “add team member” template—it encodes the exact monorepo locations, duplicate image requirement, and TypeScript entry shape in experts-data.tsx, then runs the bun render-cards pipeline so documentation shows the new card. Solo builders who fork Remotion for their own expert directory can adapt the steps, but the skill assumes Remotion’s packages/docs and packages/promo-pages layout. Use it when onboarding a listed expert after vetting, keeping marketing and docs visuals consistent, and avoiding broken image URLs on the public experts index.1kinstalls6Make Prmake-pr is a Ship-phase workflow skill for solo and indie builders (and small teams) who use GitHub and the gh CLI to land feature work. It encodes Remotion monorepo habits: never ship from main without a branch, format touched packages with Oxfmt via Bun, commit, push, and open a pull request whose title must follow the companion pr-name skill—not ad-hoc titles in chat. The skill is narrow by design: it does not replace code review, CI, or release tagging; it standardizes the last mile from “changes on disk” to “reviewable PR.” Use it when your agent has finished implementation and you want consistent formatting and PR metadata without manually chaining shell commands. You need gh authenticated, Bun available for oxfmt, and the pr-name convention in your repo if you want compliant titles.1kinstalls7Add SfxAdd SFX is a Remotion contributor skill that standardizes how new sound effects enter the @remotion/sfx package. It assumes you are extending the official media catalog: add the WAV to remotion.media, register it in generate.ts, run generation to refresh files and variants.json, deploy, then expose a camelCase URL export and matching documentation under packages/docs. The skill enforces licensing and audio quality gates—Creative Commons 0 only and normalization to -3 dB peak—so downstream video templates stay safe to ship. Indie builders rarely need this unless they fork Remotion or contribute upstream; for them it is a precise integration checklist that keeps agents from skipping the remotion.media source-of-truth step.1kinstalls8Fix Dependabotfix-dependabot is a procedural agent skill for solo maintainers of Bun monorepos who inherit Dependabot pull requests that only touch one package.json and never refresh the lockfile. The documented problem is familiar: CI fails or sibling packages still pin the old version while the PR looks green on the surface. The skill walks through GitHub CLI inspection of the PR branch, checking out that branch, searching every package.json with ripgrep for the dependency at the prior version, updating each match to the new version while keeping prefix conventions, running bun install from the repo root, verifying git status for expected files only, then committing and pushing before switching back to main. It is intentionally narrow—no generic security audit—focused on making dependency PRs actually mergeable in multi-package repos like those common in indie OSS and small SaaS codebases.302installs9Pr Namepr-name is a lightweight agent skill that teaches the exact pull request title format expected in Remotion’s monorepo workflow. Solo and indie builders shipping video or programmatic-media features with Remotion—or any multi-package repo that copies the same convention—use it when an agent drafts a PR title so it matches maintainer expectations without guesswork. The skill reads package identity from package.json, prefers the most relevant package when several are affected, and switches to a Docs: line for documentation-only edits. It does not replace conventional commits or body content; it standardizes the one-line title agents and humans see in GitHub. Install it when you automate contributions, run agents on open-source Remotion packages, or want consistent naming before review and release notes are generated.298installs10Versionversion is a lightweight maintainer skill for solo builders and contributors working inside the Remotion monorepo who need documentation to cite the correct upcoming patch version. Remotion ships frequent releases, and stale version mentions in guides, API pages, or changelogs confuse users and break copy-paste install commands. The skill states that work is on the next version (patch bump) and that the canonical number lives in packages/core/src/version.ts, then directs the agent to audit docs for mismatches. It fits early in a doc PR or pre-release pass when you are not changing feature code but must keep public docs trustworthy. Confidence is high because the scope is narrow, though it assumes you already have the repo checked out.118installs11Add Cli Optionadd-cli-option is an agent skill for solo builders and open-source contributors who modify the Remotion monorepo and need new command-line or config knobs to behave like first-class options instead of ad-hoc parsing. It walks through creating an option module with module-level default state, a stable cliFlag, human-readable metadata, and getValue logic that respects CLI overrides versus config sources. You learn how to pick TypeScript value types, handle inverted boolean flags, optionally expose SSR names, and link to public documentation so Studio and CLI stay consistent. That matters when agents or scripts pass flags during renders: a single AnyRemotionOption definition prevents drift between CLI, programmatic config, and docs. The skill is narrow but deep—ideal when you are asked to add `--my-flag` or migrate a legacy flag into the shared options registry Remotion expects across packages.104installs12Visual Modevisual-mode is an agent skill for indie video-tool builders and Remotion Studio contributors who need Visual Mode to keep Sequences editable after hot reload without remounting the wrong node. It clarifies how overrideId preserves identity when source locations shift, while stack strings can change on reload and may be shared across sequences. nodePath is treated as the durable key paired with index for UI expanded state, with mapping flows from nodePath to overrideId so components do not remount unexpectedly. The skill also warns that unsymbolicated and symbolicated stacks can diverge under fast refresh, so identity logic must not assume one-to-one stack stability. Use it when you are implementing or debugging visual editing of Sequences in Studio rather than writing compositions alone. It spans build-heavy work and ship-time debugging when editor state drifts after saves or refresh.104installs13Add New Packageadd-new-package guides agents and maintainers through creating another first-class @remotion package inside the Remotion monorepo. It standardizes the folder layout—package manifest, tsgo declaration emit settings, index exports, Bun bundle script with React externals, ESLint flat config, npm ignore, and README—and then walks through every registry touchpoint so the CLI, create-video, studio-shared metadata, and documentation site stay consistent. The skill is aimed at contributors shipping new video-related capabilities as installable Remotion modules rather than one-off app code. Following it reduces missed references that break composite TypeScript builds or leave packages invisible to studio installers. Treat it as the authoritative checklist when the feature belongs in the public package graph, not a private app experiment.103installs14Prpr is a Remotion repository workflow skill that turns finished feature work into a review-ready GitHub pull request. It enforces branch hygiene away from main, formats touched packages with Oxfmt, and runs the same build and stylecheck gates CI expects before commit and push. Titles must conform to the separate pr-name skill so release and changelog automation stay predictable. For the PR body, the skill deliberately avoids passing Markdown through fragile inline shell arguments, instructing agents to write a temp file such as /tmp/remotion-pr-body.md and call gh pr create with --body-file. Solo builders contributing patches to Remotion—or agents acting on their behalf—use this to reduce rejected PRs from formatting drift or malformed titles.103installs15Add EffectAdd-effect is a maintainer-facing agent skill for solo or small-team contributors extending Remotion’s official effects package—not for end users who only compose videos in Remotion Studio. It encodes how to pick effect shape (WebGL2 vs 2D), lay out files under packages/effects, wire Internals.createEffect, define defaults and SequenceSchema for visual editing, validate parameters, and complete the release hygiene: exports, documentation, demos, preview images, Remotion skill updates, tests, formatting, and builds. If you are shipping programmatic video (changelog reels, codegen promos, or AI-generated motion graphics) and you own a fork or contribute upstream, this skill keeps new effects consistent with chromatic-aberration-style patterns. Casual Remotion consumers should use existing effects; invoke this only when you are adding a net-new effect to the library itself.101installs16Update VersionThe update-version skill is a narrow release-hygiene procedure for Remotion documentation contributors. When a pull request adds or changes docs that include AvailableFrom version attributes, those values should reflect the next patch release, not an arbitrary number. The agent fetches main, reads VERSION from packages/core/src/version.ts on origin/main, increments the patch component by one, finds AvailableFrom entries modified in the current branch under packages/docs, and updates only those entries to the computed version. Unrelated availability tags elsewhere in the tree stay untouched. Solo maintainers and indie video-code shops using Remotion benefit because agent-assisted doc PRs stay consistent with the monorepo’s single source of truth for versioning, reducing reviewer churn before ship.81installs17Remotion Best Practicesremotion-best-practices (3D section) teaches solo and indie builders how to embed Three.js and React Three Fiber scenes inside Remotion compositions. It assumes a normal R3F workflow but adds non-negotiable Remotion rules: install `@remotion/three`, size `ThreeCanvas` to the composition via `useVideoConfig()`, and always include lighting so materials render predictably. The highest-impact constraint is temporal: anything that moves—shaders, transforms, procedural motion—must be keyed off `useCurrentFrame()` so each exported frame is deterministic. Using `useFrame()` or other time sources that advance independently of the Remotion timeline is an anti-pattern because preview and final encode will disagree, often showing as flicker. Use this skill when you are past idea validation and actively building a motion deliverable (promo, tutorial, data viz reel) where 3D is part of the React tree. It is not a general Three.js course; it is the Remotion-specific guardrails layered on top of community R3F guidance.54installs18IssueThe issue skill is a Remotion-focused agent playbook for opening, updating, and commenting on GitHub issues using the gh CLI and consistent naming. Solo and indie maintainers shipping video tooling in the Remotion monorepo use it to prefix titles by package (`@remotion/lambda`: …) or by surface (Docs:, Studio:, CI:) so triage stays searchable. It encodes title anti-patterns and the critical rule that long bodies must not be inlined in shell arguments, which otherwise corrupts Markdown on GitHub. It does not replace full issue graph management—linking sub-issues and blocking relationships belongs to issue-management. Install it when your agent drafts issues frequently and you want Remotion conventions applied every time without manual copy-paste from CONTRIBUTING docs.26installs19Pr ReadyPr-ready is a Remotion repository workflow skill for solo builders and contributors whose pull request is stuck. It applies when CI is red, the branch conflicts with the base, or the working tree has unpushed or uncommitted work that blocks a clean review. The agent starts with git status, unpushed commit detection, conflict checks against the base branch, and GitHub CLI inspection of PR checks. For conflicts it updates the base reference, rebases or merges following existing project practice, resolves files carefully, runs formatting and tests for affected packages, and seeks confirmation before push. For CI failures it reads failing job logs via gh, fixes the underlying issue, runs the matching local verification, commits if needed, and again confirms before pushing. The skill explicitly stops for user approval whenever local changes or conflict resolution would create new commits or pushes, which keeps indie operators in control of their branch history while still automating the diagnostic steps.26installs20Issue ManagementIssue-management is a focused agent skill for Remotion-era and general GitHub workflows that rely on Issues 2.0 relationship flags in the GitHub CLI. It tells you when to use the skill—creating, editing, inspecting, or removing links between issues—and how to sanity-check that your installed gh binary actually exposes --parent, --add-sub-issue, --add-blocked-by, and similar options introduced in recent CLI work. Commands use issue numbers in the current repository or full issue URLs for cross-repo dependencies. Parent/sub-issue rules are spelled out so each sub-issue has exactly one parent, matching how solo builders decompose video pipelines, docs tasks, or infra chores. If flags are absent, the skill directs you to upgrade gh rather than guessing deprecated syntax. Best for builders who live in terminal-driven PM and want agents to maintain a coherent dependency graph on GitHub.15installs