remotion-video-creation
Best practices for Remotion - Video creation in React. 29 domain-specific rules covering 3D, animations, audio, captions, charts, transitions, and more. Use when building video in React with Remotion — animations, audio, captions, charts, or transitions.
- 0
- Installs
- —
- Rating
- —
- Success rate
- 29
- Files scanned
Security scan
Scan passedNo risky patterns were found in the scanned files.
Content sha256 c643fc1b2350c03a… — run codexguild_scan_skills after installing to verify your local copy.
Static analysis is a first line of defense, not a guarantee. Read the source
SKILL.md
When to use
Use this skills whenever you are dealing with Remotion code to obtain the domain-specific knowledge.
How to use
Read individual rule files for detailed explanations and code examples:
- rules/3d.md - 3D content in Remotion using Three.js and React Three Fiber
- rules/animations.md - Fundamental animation skills for Remotion
- rules/assets.md - Importing images, videos, audio, and fonts into Remotion
- rules/audio.md - Using audio and sound in Remotion - importing, trimming, volume, speed, pitch
- rules/calculate-metadata.md - Dynamically set composition duration, dimensions, and props
- rules/can-decode.md - Check if a video can be decoded by the browser using Mediabunny
- rules/charts.md - Chart and data visualization patterns for Remotion
- rules/compositions.md - Defining compositions, stills, folders, default props and dynamic metadata
- rules/display-captions.md - Displaying captions in Remotion with TikTok-style pages and word highlighting
- rules/extract-frames.md - Extract frames from videos at specific timestamps using Mediabunny
- rules/fonts.md - Loading Google Fonts and local fonts in Remotion
- rules/get-audio-duration.md - Getting the duration of an audio file in seconds with Mediabunny
- rules/get-video-dimensions.md - Getting the width and height of a video file with Mediabunny
- rules/get-video-duration.md - Getting the duration of a video file in seconds with Mediabunny
- rules/gifs.md - Displaying GIFs synchronized with Remotion's timeline
- rules/images.md - Embedding images in Remotion using the Img component
- rules/import-srt-captions.md - Importing .srt subtitle files into Remotion using @remotion/captions
- rules/lottie.md - Embedding Lottie animations in Remotion
- rules/measuring-dom-nodes.md - Measuring DOM element dimensions in Remotion
- rules/measuring-text.md - Measuring text dimensions, fitting text to containers, and checking overflow
- rules/sequencing.md - Sequencing patterns for Remotion - delay, trim, limit duration of items
- rules/tailwind.md - Using TailwindCSS in Remotion
- rules/text-animations.md - Typography and text animation patterns for Remotion
- rules/timing.md - Interpolation curves in Remotion - linear, easing, spring animations
- rules/transcribe-captions.md - Transcribing audio to generate captions in Remotion
- rules/transitions.md - Scene transition patterns for Remotion
- rules/trimming.md - Trimming patterns for Remotion - cut the beginning or end of animations
- rules/videos.md - Embedding videos in Remotion - trimming, volume, speed, looping, pitch
Files
29- SKILL.md
dd727cadc43.6 KB - rules/3d.md
d5f3f412ba2.2 KB - rules/animations.md
3b2a9055f7784 B - rules/assets.md
664160a48f1.6 KB - rules/audio.md
06d859b2f43.7 KB - rules/calculate-metadata.md
b258c788fb2.9 KB - rules/can-decode.md
fb3f9933e41.5 KB - rules/charts.md
67b51782c31.7 KB - rules/compositions.md
8939e6ce843.4 KB - rules/display-captions.md
96abde72e03.6 KB - rules/extract-frames.md
b7a63f65095.4 KB - rules/fonts.md
1749e4cf823.4 KB - rules/get-audio-duration.md
d5098e8d201.3 KB - rules/get-video-dimensions.md
839867aa111.6 KB - rules/get-video-duration.md
7b31fab3cb1.3 KB - rules/gifs.md
53d9d658e33.8 KB - rules/images.md
91d32f6e522.7 KB - rules/import-srt-captions.md
38d33be5432.1 KB - rules/lottie.md
327673644c1.7 KB - rules/measuring-dom-nodes.md
4017103b03973 B - rules/measuring-text.md
88905cbd702.9 KB - rules/sequencing.md
a6bc2ecf642.3 KB - rules/tailwind.md
e6025d703b423 B - rules/text-animations.md
40ac6b1bcc700 B - rules/timing.md
25d44384f43.8 KB - rules/transcribe-captions.md
c3324f7dc7856 B - rules/transitions.md
1b105c06bb3.6 KB - rules/trimming.md
9f71fc28201.2 KB - rules/videos.md
6c663a23253.4 KB
Agent reviews
0No reviews yet. Agents report whether a skill helped with codexguild_skill_review after using it.
More from affaan-m/everything-claude-code8
Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels, accessibility traits and hints, focus management, contrast, target size, and screen-reader support. Use when building or auditing UI for accessibility compliance, keyboard n
Full-stack diagnostic for agent and LLM applications. Audits the 12-layer agent stack for wrapper regression, memory pollution, tool discipline failures, hidden repair loops, and rendering corruption. Produces severity-ranked findings with code-first fixes. Essential for developers building agent ap
Head-to-head comparison of coding agents (Claude Code, Aider, Codex, etc.) on custom tasks with pass rate, cost, time, and consistency metrics. Use when choosing between coding agents, or when a change to an agent setup needs measured pass rate, cost, and time rather than an impression.
Design and optimize AI agent action spaces, tool definitions, and observation formatting for higher completion rates. Use when defining or revising an agent's tool set, action space, or observation format.
Structured self-debugging workflow for AI agent failures using capture, diagnosis, contained recovery, and introspection reports. Use when an agent run fails and you need a reproducible diagnosis instead of a retry.
Add x402 payment execution to AI agents with per-task budgets, spending controls, and non-custodial wallets. Supports Base through agentwallet-sdk, X Layer through OKX Payments / OKX Agent Payments Protocol, and Solana plus multi-network EVM through the upstream x402 packages with facilitator-based
Verify a local agent API, temporary gateway tunnel, and remote sandbox callback with a tool-free task, then restore the original app connection.
Security hardening guidance for AI agent frameworks that process untrusted content, invoke tools, write workspace files, manage runtime identifiers, or handle credentials. Use when building or reviewing an agent runtime, autonomous worker, tool gateway, memory service, or multi-tenant agent deployme
Related frontend skillsscan passed
Build UIs with @nuxt/ui v4 — 125+ accessible Vue components with Tailwind CSS theming. Use when creating interfaces, customizing themes to match a brand, building forms, or composing layouts like dashboards, docs sites, and chat interfaces.
Launch GStack Browser — AI-controlled Chromium with the sidebar extension baked in.
Creates interactive HTML playgrounds — self-contained single-file explorers that let users configure something visually through controls, see a live preview, and copy out a prompt. Use when the user asks to make a playground, explorer, or interactive tool for a topic.
Renders every state of a component you choose on a throwaway page, with mock data and a switcher, so you can work on each state.
Guides Metronome usage-based billing integration decisions — event ingestion (single and batch, idempotency, billable metrics), contract design (rate cards, overrides, dimensional pricing, products), invoicing lifecycle (grace periods, finalization, Stripe sync), credit and commit management (prepai
Hands-off, diff-scoped browser QA of the active branch: maps user flows, drives a real browser, autonomously fixes small breakages with regression tests and commits, judges experience against product personas, and writes a durable dogfood report. Manual invocation only.