Remotion Best Practices
lyonjs/shortvid.io
Best practices for Remotion - Video creation in React. An agent skill from lyonjs/shortvid.io.
Best practices for Remotion - Video creation in React. An agent skill from elophanto/EloPhanto.
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install elophanto/EloPhanto remotion-best-practices --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/remotion-best-practices .claude/skills/remotion-best-practices && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .claude/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practicesType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install elophanto/EloPhanto remotion-best-practices --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/remotion-best-practices .agents/skills/remotion-best-practices && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .agents/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install elophanto/EloPhanto remotion-best-practices --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/remotion-best-practices .cursor/skills/remotion-best-practices && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .cursor/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/elophanto/EloPhanto.git --path skills/remotion-best-practices--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install elophanto/EloPhanto remotion-best-practices --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/remotion-best-practices .gemini/skills/remotion-best-practices && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .gemini/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install elophanto/EloPhanto remotion-best-practicesInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/remotion-best-practices .github/skills/remotion-best-practices && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .github/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add elophanto/EloPhanto --skill remotion-best-practices -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install elophanto/EloPhanto remotion-best-practices --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/elophanto/EloPhanto.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/remotion-best-practices .opencode/skills/remotion-best-practices && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "remotion-best-practices" agent skill from https://github.com/elophanto/EloPhanto/tree/main/skills/remotion-best-practices into .opencode/skills/remotion-best-practices/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "remotion-best-practices", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
remotion-best-practicesBest practices for Remotion - Video creation in React. An agent skill from elophanto/EloPhanto.
Remotion Best Practices is an agent skill from elophanto/EloPhanto. Best practices for Remotion - Video creation in React. Use when asked to create, render, or edit videos programmatically.
Its SKILL.md is about 2.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 38 other files (for example `rules/3d.md`, `rules/animations.md` and `rules/assets.md`).
It sits in Media & Creative, covering Video production. It works with Remotion and React. The repository describes itself as: Source-available autonomous AI agent with a self-model that actually changes as it runs - ego, affect and identity grounded in real psychology (Higgins, PAD/OCC). Writes its own…
5 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit 7bfc65d. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
npxnpmFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md. Its commands use npx and npm, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Remotion Best Practices loads about 2.3k tokens when it runs. Until then it costs about 36 tokens; SKILL.md has 862 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check noted patterns worth knowing about, such as sudo or a known installer.
m env/secret store, not hard-coded, and `.env` files are not committedAutomated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
Its licence (Custom licence) doesn't allow us to republish the file, so here is its outline and opening line. It has 862 words (~2,250 tokens).
“When asked to create a video, follow this sequence:”
SKILL.md and 37 other files in skills/remotion-best-practices of elophanto/EloPhanto.
Open the folder on GitHubat commit 7bfc65d
Remotion Best Practices next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Remotion Best Practices this skillelophanto/EloPhanto | 106 | — | ~2.3k | Automated safety check: Notes | Custom licence | |
| Remotion Best Practiceslyonjs/shortvid.io | 147 | 33 repos | ~1k | Automated safety check: Pass | MIT | |
| Remotion to HyperFrames Porterheygen-com/hyperframes | 60k | 3 repos | ~2.8k | Automated safety check: Pass | Apache-2.0 | |
| Anything2explainerVincentwei1021/anything2explainer | 2.4k | — | ~2.7k | Automated safety check: Pass | Custom licence | |
| Remotion Motion Graphicshaidrrrry/claude-remotion-skill | 340 | — | ~2k | Automated safety check: Pass | MIT | |
| Remotion BitsMarve10s/Better-Fullstack | 756 | 1 repos | ~8.2k | Automated safety check: Pass | MIT |
lyonjs/shortvid.io
Best practices for Remotion - Video creation in React. An agent skill from lyonjs/shortvid.io.
heygen-com/hyperframes
Ports an existing Remotion (React) composition to HyperFrames HTML with GSAP, one way, and grades the result against a tiered set of reference fixtures.
Vincentwei1021/anything2explainer
给一个主题,产出一条黑底 MG 风格(幕底可选星点或点阵波)、有配音字幕章节进度条的科普讲解视频(中文或英文;Remotion 代码动画;时长由用户定,常用 3–5 分钟)。内含可编译模板、图元库、配音/分镜/渲染工具、风格与动效规范、多 agent 分工协议与 QC 判据,以及一条完整样片(《RAG 与知识库》)作为质量标尺。Turn any topic into a narrated…
haidrrrry/claude-remotion-skill
Create and edit professional motion graphics videos with Remotion (React-based video).
Marve10s/Better-Fullstack
Animation components and utilities for Remotion video projects.
Marve10s/Better-Fullstack
Create Remotion videos using the Geist design system aesthetic.
elophanto/EloPhanto
Join a Google Meet or Zoom call as a video meeting agent via PikaStreaming.
elophanto/EloPhanto
Metaplex development on Solana — NFTs, tokens, compressed NFTs, candy machines, token launches.
elophanto/EloPhanto
Audit animation code against Disney's 12 principles adapted for web.
elophanto/EloPhanto
A skill your agent uses when investigating any claim, question, or topic where the easy first answer is likely insufficient.
elophanto/EloPhanto
A skill your agent uses when running dangerous shell commands, installing untrusted packages, or testing untrusted code that could damage the host.
elophanto/EloPhanto
Key facts and links for Next.js 16. An agent skill from elophanto/EloPhanto.
Categories
Best practices for Remotion - Video creation in React. An agent skill from elophanto/EloPhanto. Remotion Best Practices is an agent skill from elophanto/EloPhanto. Best practices for Remotion - Video creation in React.
Remotion Best Practices fits situations like: asked to create; edit videos programmatically.
Run `npx skills add elophanto/EloPhanto --skill remotion-best-practices -a claude-code`. Or copy the skill folder (skills/remotion-best-practices in elophanto/EloPhanto) into .claude/skills/remotion-best-practices in your project. Claude Code loads it when a task matches its description.
Run `npx skills add elophanto/EloPhanto --skill remotion-best-practices -a codex`. Or copy the skill folder (skills/remotion-best-practices in elophanto/EloPhanto) into .agents/skills/remotion-best-practices in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add elophanto/EloPhanto --skill remotion-best-practices -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/remotion-best-practices, .gemini/skills/remotion-best-practices, .github/skills/remotion-best-practices and .opencode/skills/remotion-best-practices in your project.
Going by SKILL.md and its folder, Remotion Best Practices needs the command-line tools its instructions call (npx and npm). Our summary lists: Node.js.
SKILL.md contains no URLs. Its commands use npx and npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found notes only (mentions a .env file), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.
Remotion Best Practices has a licence file (the repository's licence) that doesn't match a standard licence. Read it on GitHub before reusing the skill.
About 2.3k tokens (SKILL.md is roughly 9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Remotion Best Practices: Remotion Best Practices (lyonjs/shortvid.io, 147 stars), Remotion to HyperFrames Porter (heygen-com/hyperframes, 60k stars), Anything2explainer (Vincentwei1021/anything2explainer, 2.4k stars) and Remotion Motion Graphics (haidrrrry/claude-remotion-skill, 340 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
elophanto (a GitHub user) maintains it in elophanto/EloPhanto, which has 106 GitHub stars. The repository holds 11 skills in this directory. The repository was last updated on October 1, 2026.
Source: elophanto/EloPhanto on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.