Individual skill
remotion-to-hyperframes
Bring existing video code or footage into HyperFrames and verify it frame by frame against the original - Remotion first, also Motion Canvas, Lottie, Three.js, p5.js, canvas or plain HTML/CSS animation, or renders from Manim, After Effects or Blender. Use to port, convert, migrate or reuse work made with another tool.
skills/remotion-to-hyperframes/SKILL.md
Source commit 183614bda3df15812d9f18fd4a71ee77a7da6387
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- Yes
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Network or broad shell
- Last checked
- Nov 4, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 80,246
- Repository last updated
- Nov 7, 2026
- License
- Apache-2.0
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
SKILL.mdcore · 5,021 bytesSKILL.mdcore · 5,021 bytesSKILL.mdcore · 5,021 bytesassets/.gitkeepasset · 0 bytesassets/test-corpus/.gitignoreasset · 16 bytesassets/test-corpus/run.shruns · 8,598 bytesassets/test-corpus/tier-1-title-card/.gitignoreasset · 128 bytesassets/test-corpus/tier-1-title-card/README.mddoc · 2,191 bytesassets/test-corpus/tier-1-title-card/expected.jsonasset · 1,791 bytesassets/test-corpus/tier-1-title-card/hf-src/compositions/title.htmlasset · 1,099 bytesassets/test-corpus/tier-1-title-card/hf-src/index.htmlasset · 1,147 bytesassets/test-corpus/tier-1-title-card/remotion-src/package.jsonruns · 296 bytesassets/test-corpus/tier-1-title-card/remotion-src/remotion.config.tsruns · 497 bytesassets/test-corpus/tier-1-title-card/remotion-src/src/Root.tsxruns · 259 bytesassets/test-corpus/tier-1-title-card/remotion-src/src/TitleCard.tsxruns · 773 bytesassets/test-corpus/tier-1-title-card/remotion-src/src/index.tsruns · 109 bytesassets/test-corpus/tier-1-title-card/remotion-src/tsconfig.jsonasset · 337 bytesassets/test-corpus/tier-2-multi-scene/.gitignoreasset · 215 bytesassets/test-corpus/tier-2-multi-scene/README.mddoc · 3,272 bytesassets/test-corpus/tier-2-multi-scene/expected.jsonasset · 2,117 bytesassets/test-corpus/tier-2-multi-scene/hf-src/compositions/scene-1.htmlasset · 1,152 bytesassets/test-corpus/tier-2-multi-scene/hf-src/compositions/scene-2.htmlasset · 1,158 bytesassets/test-corpus/tier-2-multi-scene/hf-src/compositions/scene-3.htmlasset · 1,004 bytesassets/test-corpus/tier-2-multi-scene/hf-src/index.htmlasset · 1,819 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/package.jsonruns · 298 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/remotion.config.tsruns · 497 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/src/MultiScene.tsxruns · 2,367 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/src/Root.tsxruns · 264 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/src/index.tsruns · 109 bytesassets/test-corpus/tier-2-multi-scene/remotion-src/tsconfig.jsonasset · 337 bytesassets/test-corpus/tier-2-multi-scene/setup.shruns · 1,244 bytesassets/test-corpus/tier-3-data-driven/.gitignoreasset · 128 bytesassets/test-corpus/tier-3-data-driven/README.mddoc · 5,089 bytesassets/test-corpus/tier-3-data-driven/expected.jsonasset · 3,343 bytesassets/test-corpus/tier-3-data-driven/hf-src/compositions/scene-1.htmlasset · 1,648 bytesassets/test-corpus/tier-3-data-driven/hf-src/compositions/scene-2.htmlasset · 3,043 bytesassets/test-corpus/tier-3-data-driven/hf-src/compositions/scene-3.htmlasset · 1,654 bytesassets/test-corpus/tier-3-data-driven/hf-src/index.htmlasset · 1,757 bytesassets/test-corpus/tier-3-data-driven/remotion-src/package.jsonruns · 319 bytesassets/test-corpus/tier-3-data-driven/remotion-src/remotion.config.tsruns · 497 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/Root.tsxruns · 681 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/Stargazed.tsxruns · 970 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/components/AnimatedNumber.tsxruns · 740 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/components/StatCard.tsxruns · 1,474 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/components/UnderlinedText.tsxruns · 1,154 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/index.tsruns · 109 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/scenes/OutroScene.tsxruns · 423 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/scenes/StatsScene.tsxruns · 676 bytesassets/test-corpus/tier-3-data-driven/remotion-src/src/scenes/TitleScene.tsxruns · 1,230 bytesassets/test-corpus/tier-3-data-driven/remotion-src/tsconfig.jsonasset · 337 bytesassets/test-corpus/tier-4-escape-hatch/README.mddoc · 2,825 bytesassets/test-corpus/tier-4-escape-hatch/cases/01-use-state.tsxruns · 1,000 bytesassets/test-corpus/tier-4-escape-hatch/cases/02-use-effect-deps.tsxruns · 954 bytesassets/test-corpus/tier-4-escape-hatch/cases/03-async-metadata.tsxruns · 1,128 bytesassets/test-corpus/tier-4-escape-hatch/cases/04-third-party-react.tsxruns · 1,183 bytesassets/test-corpus/tier-4-escape-hatch/cases/05-lambda-config.tsxruns · 1,425 bytesassets/test-corpus/tier-4-escape-hatch/cases/06-warnings-only.tsxruns · 1,387 bytesassets/test-corpus/tier-4-escape-hatch/cases/07-custom-hook.tsxruns · 1,094 bytesassets/test-corpus/tier-4-escape-hatch/cases/08-mixed.tsxruns · 1,166 bytesassets/test-corpus/tier-4-escape-hatch/expected.jsonasset · 2,784 bytesassets/test-corpus/tier-4-escape-hatch/validate.shruns · 3,534 bytesreferences/api-map.mddoc · 16,476 bytesreferences/escape-hatch.mddoc · 5,403 bytesreferences/eval.mddoc · 4,409 bytesreferences/fonts.mddoc · 3,246 bytesreferences/limitations.mddoc · 5,042 bytesreferences/lottie.mddoc · 5,044 bytesreferences/media.mddoc · 4,528 bytesreferences/parameters.mddoc · 4,916 bytesreferences/sequencing.mddoc · 6,992 bytesreferences/timing.mddoc · 7,021 bytesreferences/transitions.mddoc · 4,500 bytesscripts/.gitkeepruns · 0 bytesscripts/lint_source.pyruns · 12,978 bytesscripts/tests/boxSizing.test.mjsruns · 939 bytesscripts/tests/fixtures/blocker.tsxruns · 1,853 bytesscripts/tests/fixtures/clean.tsxruns · 1,379 bytesscripts/tests/smoke.shruns · 1,495 bytes
Read excerpt
**Plugin installs:** Before setup or freshness commands, follow [plugin execution rules](../hyperframes/references/plugin-installation.md) when this skill is inside a HyperFrames plugin.
# Import into HyperFrames
HyperFrames is the container: its tracks, sub-compositions and variables are editable in Studio whatever runs inside a clip. Bring each part in at the highest level it supports and record which level you used.
| Level | For | How | Editable in Studio afterwards |
| --- | --- | --- | --- |
| Native | code that can become HTML + GSAP: most Remotion, HTML/CSS/GSAP animation, simple Motion Canvas | translate it, then verify frame by frame | every element; variables, catalog, presets apply |
| Hosted | code that can draw any requested frame in a browser: canvas, p5.js, Three.js, Lottie, WebGL, other JS animation | keep the code and drive it from HyperFrames time | timing, position, exposed parameters |
| Media | anything that outputs video or frames: Manim, After Effects, Blender, PIL, moviepy | render to a file and use it as a clip | cut, place, layer; not the pixels inside |
Code that depends on wall-clock time, live physics or the network can only come in as media.