Remotion 可编辑视频最佳实践
提供 Remotion 代码片段、渲染配置与开发建议。
使用前,准备这些
输入素材:视频或脚本、目标时长与风格
- 在下方原始文档中确认支持的 AI 工具、模型和运行依赖。
- 打开原仓库,按作者的安装说明完成配置;模型 API 或外部服务可能需要单独开通。
- 用自己的素材试运行,再检查事实、版式与输出文件。
许可证:未明确声明,请查看原仓库的使用条件。
来源快照:2026-09-15。README ↗
可以这样开始
Remotion Agent Skills
Remotion maintains a list of Agent Skills that define best practices for working in Remotion projects.
These skills are useful for AI agents like Claude Code, Codex, Kimi Code or Cursor.
You can install them by running:
npx skills add remotion-dev/skills
You are also offered the option to add skills when you create a new Remotion project:
bun create video
For more information, see the Remotion Agent Skills documentation.
Available skills
/remotion-best-practices
This skill encompasses all other skills.
Use it if you are not sure which specific skill to use.
/remotion-create
Create a new Remotion project or composition.
Example prompt:
/remotion-create Make a promo video for a record store
/remotion-markup
Best practices for writing Remotion React markup.
Use this for knowledge about compositions, animations, layout, typography, media elements, effects, audio, fonts, timing.
Example prompt:
/remotion-markup Create an animated title card using Inter.
/remotion-studio
Launch the Studio to see a preview of your video.
Example prompt:
/remotion-studio
/remotion-render
Invoke a render into a video or a still.
Example prompt:
/remotion-render
/remotion-maps
Best practices for creating map animations in Remotion.
Use this for static maps, animated routes and markers, geographic explainers, Mapbox, MapLibre, MapTiler, GeoJSON, and 3D geographic flyovers with CesiumJS.
Example prompt:
/remotion-maps Animate a route from Los Angeles to New York and make the camera follow it.
/remotion-captions
Guidance for captions and subtitles.
/remotion-saas
Architecture guidance for Remotion-powered apps and product integrations.
Example prompt:
/remotion-saas Turn my video into a SaaS.
/remotion-interactivity
Guidance for making Remotion code editable in Studio.
Use this when elements are not selectable or editable as you would like them to be.
/remotion-docs
Search the Remotion documentation and fetch any page as Markdown.
Use this to look up current API references, component props, and package guides before implementing.
Example prompt:
/remotion-docs How to set up Remotion Lambda?
/remotion-upgrade
Upgrade Remotion, related packages, compatible Mediabunny packages, and installed Remotion Agent Skills.
Example prompt:
/remotion-upgrade
/remotion-multimedia
Guidance for browser-based multimedia handling with Mediabunny.
Use this for advice on how to get video and audio metadata.