Remotion Best Practices
A comprehensive reference for building video content with Remotion's React-based framework. Covers the full workflow from basic animations and sequencing to advanced topics like 3D rendering with Three.js, audio manipulation, and transparent video exports. Includes specific guides for common needs like syncing GIFs to the timeline, fitting text to containers, implementing light leak effects, and working with Lottie animations. The captioning system gets its own dedicated reference file. If you're programmatically generating videos in React and need to know the right patterns for timing curves, asset loading, or composition metadata, this gives you the domain knowledge without hunting through docs.
- skills.sh installs
- 1.6K
- GitHub stars
- 19.5K
- last updated
- Aug 21, 2026
Install
$ npx -y skills add vercel-labs/json-render --skill remotion-best-practices --agent claude-codeInstalls into .claude/skills of the current project.
Files
When to use
Use this skills whenever you are dealing with Remotion code to obtain the domain-specific knowledge.
Captions
When dealing with captions or subtitles, load the ./rules/subtitles.md file for more information.
How to use
Read individual rule files for detailed explanations and code examples:
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/vercel-labs/json-render
- Categories
- Frontend Development, Cloud & Infrastructure, Generative Media
- First seen
- May 16, 2026
More from vercel-labs/json-render
All 31- Vue1.4K
- React Email1.4K
- Skill Creator1.4K
- Ink1.3K
- Svelte1.2K
- Shadcn Svelte1.2K
- Redux1.1K
- Jotai1.1K
- Xstate1.1K
- Solid1.1K
- Yaml1.1K
- Json Render React391
- Json Render Core340
- Json Render Shadcn213
- Json Render Remotion153
- Json Render React Native142
- React18.5K
- Core17.2K
- Codegen8.9K
- Next8.6K
- Devtools8.4K
- Directives8.1K
- Mcp5.9K
- React Native3.3K
Recommended
More Frontend Development
liteparseK-Dense-AI/scientific-agent-skillsLocal document and PDF parsing that returns spatial text with bounding boxes. Use for extracting text from PDFs, DOCX, Office files, and images; running OCR on 1.6Kskills.sh installs
listenhubmarswaveai/skillsListenHub CLI skills router. Routes to the correct skill based on user intent. Triggers on: "make a podcast", "explainer video", "read aloud", "TTS", "generate 1.6Kskills.sh installs
building-mobile-appsforcedotcom/sf-skillsThe entry point for building any Salesforce native mobile app on iOS or Android. TRIGGER when the user says: "build a Salesforce iOS app", "add Salesforce login1.5Kskills.sh installs
instagram-researchbradautomates/head-of-contentResearch high-performing Instagram content (posts and reels) from tracked accounts using Apify's Instagram Scraper. Identifies outlier content, analyzes top 5 v1.5Kskills.sh installs
tilegym-converting-cutile-to-tritonnvidia/skillsConverts cuTile GPU kernels (@ct.kernel) to Triton (@triton.jit). Handles standard in-repo conversion, debugging (cudaErrorIllegalAddress, shape mismatch, numer1.5Kskills.sh installs
threat-model-analystgithub/awesome-copilotFull STRIDE-A threat model analysis and incremental update skill for repositories and systems. Supports two modes: (1) Single analysis — full STRIDE-A threat mo1.5Kskills.sh installs