Agent skill

Remotion Video Toolkit

by CraftOS-dev in CraftOS-dev/CraftBot

Complete toolkit for programmatic video creation with Remotion + React.

MITAuto-check passedMedia & Creative

Install Remotion Video Toolkit

skills CLI
$ npx skills add CraftOS-dev/CraftBot --skill remotion-video-toolkit -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install CraftOS-dev/CraftBot remotion-video-toolkit --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/CraftOS-dev/CraftBot.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/remotion-video-toolkit .claude/skills/remotion-video-toolkit && rm -rf skills-src

Use ~/.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/

Facts

Skill name
remotion-video-toolkit
GitHub stars
392
Used in
2 other repos
Token cost
~1.4k tokens
SKILL.md length
486 words
Files
35
Skills in repo
89
Repo updated
First seen
Licence
MIT

At a glance

Complete toolkit for programmatic video creation with Remotion + React.

  • Writing Remotion code
  • SKILL.md covers What you can build with this, Requirements, What's inside and Quick start, plus 1 more section
  • Calls npx and npm
  • Building video generation pipelines

What it does

Remotion Video Toolkit is an agent skill from CraftOS-dev/CraftBot. Complete toolkit for programmatic video creation with Remotion + React. Covers animations, timing, rendering (CLI/Node.js/Lambda/Cloud Run), captions, 3D, charts, text effects, transitions, and media handling. Use when writing Remotion code, building video generation pipelines, or creating data-driven video templates.

Its SKILL.md is about 1.4k tokens, which your agent loads only when the skill is triggered. The skill folder holds 37 other files (for example `.clawhub/origin.json`, `_meta.json` and `rules/3d.md`).

It sits in Media & Creative, covering Video production, AI video generation and Transcription. It works with Remotion, Cloud Run, Node.js and React. The repository describes itself as: One agent. Every kind of work. The licence is MIT.

When your agent uses it

  • Writing Remotion code
  • Building video generation pipelines
  • Creating data-driven video templates

Example prompts

  • “/remotion-video-toolkit”

Requirements

  • Node.js

What it can do on your machine

Read from SKILL.md and the folder at commit b50970c. It shows what the files ask for, not the result of running them.

  • Tool permissions

    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.

  • Runs code

    Shell commands in SKILL.md call:

    • npx
    • npm

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • github.com
    • 99.zone

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Remotion Video Toolkit loads about 1.4k tokens when it runs. Until then it costs about 86 tokens; SKILL.md has 486 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~86
When it runs · the whole SKILL.md, loaded when a task matches
~1.4k

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.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated 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.

SKILL.md

The full file from CraftOS-dev/CraftBot at commit b50970c, republished under its MIT licence (© CraftOS-dev). 486 words, ~1,395 tokens.

Download SKILL.mdSave it as .claude/skills/remotion-video-toolkit/SKILL.md (or your agent's skills folder). This skill also uses 34 other files; get the full folder from GitHub.
name
remotion-video-toolkit
description
Complete toolkit for programmatic video creation with Remotion + React. Covers animations, timing, rendering (CLI/Node.js/Lambda/Cloud Run), captions, 3D, charts, text effects, transitions, and media handling. Use when writing Remotion code, building video generation pipelines, or creating data-driven video templates.

Remotion Video Toolkit

Write React components, get real MP4 videos. This skill teaches your AI agent how to build with Remotion — from a first animation to a production rendering pipeline.

29 rules. Every major Remotion feature covered.


What you can build with this

Personalized video at scale Feed user data as JSON props, render a unique video per user. Think Spotify Wrapped, GitHub Unwrapped, onboarding walkthroughs — one template, thousands of outputs.

Automated social media clips Pull live data (stats, leaderboards, product metrics) and render daily or weekly video posts without anyone touching a timeline editor.

Dynamic ads and marketing videos Swap in customer name, product image, pricing. Same template, infinite variations. Render server-side via API or Lambda.

Animated data visualizations Turn dashboards and KPI reports into shareable video clips with animated charts and transitions.

TikTok and Reels captions Transcribe audio, display word-by-word highlighted subtitles, export ready for upload.

Product showcase videos Auto-generate from your database — images, specs, pricing — straight to MP4.

Educational and explainer content Animated course materials, certificate videos, step-by-step walkthroughs — all driven by code.

Video generation as a service Expose rendering as an HTTP endpoint. Your app sends JSON, gets back a video file.


Requirements

  • Node.js 18+
  • React 18+ (Remotion renders React components frame-by-frame)
  • Remotion — scaffold with npx create-video@latest
  • FFmpeg — ships with @remotion/renderer, no separate install needed
  • For serverless rendering: AWS account (Lambda) or GCP account (Cloud Run)

What's inside

Core
RuleDescription
CompositionsDefine videos, stills, folders, default props, dynamic metadata
RenderingCLI, Node.js API, AWS Lambda, Cloud Run, Express server patterns
Calculate metadataSet duration, dimensions, and props dynamically at render time
Animation and timing
RuleDescription
AnimationsFade, scale, rotate, slide
TimingInterpolation curves, easing, spring physics
SequencingDelay, chain, and orchestrate scenes
TransitionsScene-to-scene transitions
TrimmingCut the start or end of any animation
Show full SKILL.md (186 more words)Show less
Text and typography
RuleDescription
Text animationsTypewriter, word highlight, reveal effects
FontsGoogle Fonts and local font loading
Measuring textFit text to containers, detect overflow
Media
RuleDescription
VideosEmbed, trim, speed, volume, loop, pitch shift
AudioImport, trim, fade, volume and speed control
ImagesThe Img component
GIFsTimeline-synced GIF playback
AssetsImporting any media into compositions
Decode checkValidate browser compatibility
Captions and subtitles
RuleDescription
Transcribe captionsAudio to captions via Whisper, Deepgram, or AssemblyAI
Display captionsTikTok-style word-by-word highlighting
Import SRTLoad existing .srt files
Data visualization
RuleDescription
ChartsAnimated bar charts, line graphs, data-driven visuals
Advanced
RuleDescription
3D contentThree.js and React Three Fiber
LottieAfter Effects animations via Lottie
TailwindCSSStyle compositions with Tailwind
DOM measurementMeasure element dimensions at render time
Media utilities
RuleDescription
Video durationGet length in seconds
Video dimensionsGet width and height
Audio durationGet audio length
Extract framesPull frames at specific timestamps

Quick start

bash
# Scaffold a project
npx create-video@latest my-video

# Preview in browser
cd my-video && npm start

# Render to MP4
npx remotion render src/index.ts MyComposition out/video.mp4

# Pass dynamic data
npx remotion render src/index.ts MyComposition out.mp4 --props '{"title": "Hello"}'

Contribute

Source: github.com/shreefentsar/remotion-video-toolkit

Missing something? Found a better approach? Open a PR — new rules, improved examples, bug fixes all welcome.

Built by Zone 99

© CraftOS-dev, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 34 other files in skills/remotion-video-toolkit of CraftOS-dev/CraftBot.

  • SKILL.md
  • .clawhub/origin.json
  • _meta.json
  • rules/3d.md
  • rules/animations.md
  • rules/assets.md
  • rules/assets/charts-bar-chart.tsx
  • rules/assets/text-animations-typewriter.tsx
  • rules/assets/text-animations-word-highlight.tsx
  • rules/audio.md
  • rules/calculate-metadata.md
  • rules/can-decode.md
  • rules/charts.md
  • rules/compositions.md
  • rules/display-captions.md
  • rules/extract-frames.md
  • rules/fonts.md
  • rules/get-audio-duration.md
  • … and 17 more

Open the folder on GitHubat commit b50970c

Used in 2 other repositories

We found 3 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 2 other GitHub owners. This page covers the copy in CraftOS-dev/CraftBot, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Remotion Video Toolkit 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.

Remotion Video Toolkit compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Remotion Video Toolkit this skillCraftOS-dev/CraftBot3922 repos~1.4kAutomated safety check: PassMIT
Anything2explainerVincentwei1021/anything2explainer2.4k—~2.7kAutomated safety check: PassCustom licence
Remotion Motion Graphicshaidrrrry/claude-remotion-skill299—~2kAutomated safety check: PassMIT
Edit Timeline Studio BrowserMartinDelophy/ai-video-editor907—~2.6kAutomated safety check: PassMIT
AI Mediaericrisco/rsc-harness174—~3.3kAutomated safety check: PassMIT
Remotion Best Practicesguanyang/open-agent-hub977—~3.1kAutomated safety check: PassMIT

Similar skills

  • Anything2explainer

    Vincentwei1021/anything2explainer

    给一个主题,产出一条黑底 MG 风格(幕底可选星点或点阵波)、有配音字幕章节进度条的科普讲解视频(中文或英文;Remotion 代码动画;时长由用户定,常用 3–5 分钟)。内含可编译模板、图元库、配音/分镜/渲染工具、风格与动效规范、多 agent 分工协议与 QC 判据,以及一条完整样片(《RAG 与知识库》)作为质量标尺。Turn any topic into a narrated…

    2.4k GitHub stars~2.7k tokensUpdated 21 days ago
    Media & CreativeAuto-check passed
  • Remotion Motion Graphics

    haidrrrry/claude-remotion-skill

    Create and edit professional motion graphics videos with Remotion (React-based video).

    299 GitHub stars~2k tokensUpdated 1 mo ago
    Media & CreativeAuto-check passed
  • Edit Timeline Studio Browser

    MartinDelophy/ai-video-editor

    Use native WebMCP tools to edit the project open in Timeline Studio.

    907 GitHub stars~2.6k tokensUpdated 2 days ago
    Media & CreativeAuto-check passed
  • AI Media

    ericrisco/rsc-harness

    A skill your agent uses when a creative goal must become a finished media file: pick and order generative-media models per modality — AI voiceover, image-to-video clips, score — then glue them with…

    174 GitHub stars~3.3k tokensUpdated 2 days ago
    Media & CreativeAuto-check passed
  • Remotion Best Practices

    guanyang/open-agent-hub

    Best practices and domain knowledge for building videos programmatically with Remotion (videos in React/TypeScript, rendered to MP4).

    977 GitHub stars~3.1k tokensUpdated yesterday
    Media & CreativeAuto-check passed
  • Create programmatic videos with Remotion and React. An agent skill from anolilab/lunora.

    282 GitHub stars~3k tokensUpdated today
    Media & CreativeAuto-check passed

More from CraftOS-dev/CraftBot

All 89 skills in this repo
  • Self Improvement

    CraftOS-dev/CraftBot

    Captures learnings, errors, and corrections to enable continuous improvement.

    392 GitHub starsUsed in 4 repos~4.9k tokens
    Auto-check passed
  • Outlook

    CraftOS-dev/CraftBot

    Read, search, and manage Outlook emails and calendar via Microsoft Graph API.

    392 GitHub starsUsed in 2 repos~1.8k tokens
    Auto-check passed
  • Nano Banana Pro

    CraftOS-dev/CraftBot

    Generate/edit images with Nano Banana Pro (Gemini 3 Pro Image).

    392 GitHub starsUsed in 5 repos~1.4k tokens
    Auto-check passed
  • Bbc News

    CraftOS-dev/CraftBot

    Fetch and display BBC News stories from various sections and regions via RSS feeds.

    392 GitHub starsUsed in 1 repo~555 tokens
    Auto-check passed
  • Airweave

    CraftOS-dev/CraftBot

    Context retrieval layer for AI agents across users' applications.

    392 GitHub stars~1.1k tokensUpdated today
    Auto-check passed
  • Telegram Bot Manager

    CraftOS-dev/CraftBot

    Manage and configure Telegram bots for OpenClaw. An agent skill from CraftOS-dev/CraftBot.

    392 GitHub stars~836 tokensUpdated today
    Auto-check passed

Questions about Remotion Video Toolkit

What does Remotion Video Toolkit do?

Complete toolkit for programmatic video creation with Remotion + React. Remotion Video Toolkit is an agent skill from CraftOS-dev/CraftBot. Complete toolkit for programmatic video creation with Remotion + React.

When should I use Remotion Video Toolkit?

Remotion Video Toolkit fits situations like: writing Remotion code; building video generation pipelines; creating data-driven video templates.

How do I install Remotion Video Toolkit in Claude Code?

Run `npx skills add CraftOS-dev/CraftBot --skill remotion-video-toolkit -a claude-code`. Or copy the skill folder (skills/remotion-video-toolkit in CraftOS-dev/CraftBot) into .claude/skills/remotion-video-toolkit in your project. Claude Code loads it when a task matches its description.

How do I install Remotion Video Toolkit in Codex?

Run `npx skills add CraftOS-dev/CraftBot --skill remotion-video-toolkit -a codex`. Or copy the skill folder (skills/remotion-video-toolkit in CraftOS-dev/CraftBot) into .agents/skills/remotion-video-toolkit in your project. Codex loads it when a task matches its description.

Can I use Remotion Video Toolkit in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add CraftOS-dev/CraftBot --skill remotion-video-toolkit -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-video-toolkit, .gemini/skills/remotion-video-toolkit, .github/skills/remotion-video-toolkit and .opencode/skills/remotion-video-toolkit in your project.

What does Remotion Video Toolkit need to run?

Going by SKILL.md and its folder, Remotion Video Toolkit needs the command-line tools its instructions call (npx and npm). Our summary lists: Node.js.

Does Remotion Video Toolkit access the network?

SKILL.md names 2 domains. As links in the text: github.com and 99.zone. This is read from the text; nothing was executed.

Is Remotion Video Toolkit safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Remotion Video Toolkit use?

Remotion Video Toolkit is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Remotion Video Toolkit use?

About 1.4k tokens (SKILL.md is roughly 5.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Remotion Video Toolkit?

Skills that share tags, products or a category with Remotion Video Toolkit: Anything2explainer (Vincentwei1021/anything2explainer, 2.4k stars), Remotion Motion Graphics (haidrrrry/claude-remotion-skill, 299 stars), Edit Timeline Studio Browser (MartinDelophy/ai-video-editor, 907 stars) and AI Media (ericrisco/rsc-harness, 174 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Remotion Video Toolkit?

CraftOS-dev (a GitHub user) maintains it in CraftOS-dev/CraftBot, which has 392 GitHub stars. The repository holds 89 skills in this directory. The repository was last updated on October 9, 2026.

Source: CraftOS-dev/CraftBot on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.