Stats
Actions
Tags
'%20stop-opacity%3D'0.16'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'rgb(200%2C90%2C60)'%20stop-opacity%3D'0.03'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'320'%20height%3D'200'%20fill%3D'url(%23g)'%2F%3E%3Ccircle%20cx%3D'250'%20cy%3D'56'%20r%3D'92'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.06'%2F%3E%3Ccircle%20cx%3D'64'%20cy%3D'172'%20r%3D'58'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.05'%2F%3E%3C%2Fsvg%3E)
Loads Remotion best practices and delegates to specialized skills for project setup, React markup, interactivity, rendering, captions, SaaS, and documentation.
How this skill is triggered — by the user, by Claude, or both
Slash command
/remotion-best-practices:remotion-best-practicesThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
If no Remotion project currently exists, load [Create a new Remotion project](remotion-create/REFERENCE.md)
mediabunny/REFERENCE.mdmediabunny/get-audio-duration.mdmediabunny/get-video-dimensions.mdmediabunny/get-video-duration.mdremotion-captions/REFERENCE.mdremotion-captions/display-captions.mdremotion-captions/import-srt-captions.mdremotion-captions/transcribe-captions.mdremotion-create/REFERENCE.mdremotion-create/tailwind.mdremotion-create/video-layout.mdremotion-docs/REFERENCE.mdremotion-interactivity/REFERENCE.mdremotion-markup/3d.mdremotion-markup/REFERENCE.mdremotion-markup/audio-visualization.mdremotion-markup/audio.mdremotion-markup/calculate-metadata.mdremotion-markup/compositions.mdremotion-markup/effects.mdIf no Remotion project currently exists, load Create a new Remotion project
If you are writing Remotion React Markup, load Remotion Markup Best Practices
For achieving multimedia tasks in the browser, such as trimming, cropping videos, or getting metadata from them, load Mediabunny Best Practices
By structuring the Remotion markup well, we can allow users to interactively change things in the Studio and write back to code. If relevant: Interactivity Best Practices
For advanced rendering beyond simple npx remotion render, see: Rendering Best Practices
When working with Captions, load Remotion Captions.
Use the Remotion SaaS skill for knowledge about Remotion-powered SaaS apps, such as <Player>, rendering on Lambda, Vercel, Cloudflare, via Express.js, client-side rendering, or for finding the right SaaS template.
To find and read current Remotion documentation, load Remotion Docs.
To upgrade Remotion, related packages, compatible Mediabunny packages, and installed Remotion Agent Skills, load Remotion Upgrade.
2plugins reuse this skill
First indexed Jul 20, 2026
npx claudepluginhub alltuner/skills --plugin remotion-best-practicesLoads Remotion best practices and delegates to specialized skills for project setup, React markup, interactivity, rendering, captions, SaaS, and documentation.
Provides Remotion best practices covering 3D, animations, audio, captions, charts, fonts, sequencing, text animations, and TailwindCSS integration.
Provides Remotion best practices covering video creation, animations, audio, captions, 3D, charts, fonts, and timing in React.