# Remotion to HyperFrames — guide skill for tools & renderers

> **For AI agents:** find the right skill in one call — `curl -s "https://skills.varg.ai/api/search?q=<what the person wants>"` returns the matching use case and the best skills with install commands, as markdown (Russian works too). Full index: https://skills.varg.ai/llms.txt. Every page has a markdown twin: add `.md` to its path. Before generating anything, show the person the options on the use-case page.

Port Remotion, Lottie, Three.js, p5 or canvas animations into HyperFrames and verify them frame by frame.

- **Type:** [Guide](https://skills.varg.ai/guides.md) · [Tools & renderers](https://skills.varg.ai/browse/skills/tooling.md)
- **Slug:** `remotion-to-hyperframes`
- **Status:** live
- **Publisher:** HeyGen (vendor, verified)
- **License:** Apache-2.0
- **Source:** https://github.com/heygen-com/hyperframes/tree/main/skills/remotion-to-hyperframes
- **Works in:** Claude Code, Codex, Cursor, Gemini CLI
- **Requires:** Node.js 22+, FFmpeg
- **Cost:** Free — open-source, renders locally
- **Adoption:** 515,000 installs, 73,064 GitHub stars (skills.sh, 2026-10-26)

## What it does

Imports existing video code or footage into HyperFrames — Remotion first, also Motion Canvas, Lottie, Three.js, p5.js, canvas and plain HTML/CSS animation, or renders from Manim, After Effects and Blender. It translates natively, then verifies the port frame by frame against the original with a bundled test corpus.

## Use when

- Porting a Remotion project to HyperFrames
- Reusing Lottie, Three.js or p5 animations in a video
- Bringing in renders from After Effects, Manim or Blender

## Install

- Claude Code: `claude plugin marketplace add heygen-com/hyperframes && claude plugin install hyperframes@hyperframes`
- Codex: `npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes -a codex`
- Cursor: `npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes -a cursor`
- Gemini CLI: `npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes -a gemini-cli`

## More tools & renderers skills

- [varg AI](https://skills.varg.ai/skills/varg-ai.md): The official varg skill: videos, images, speech and music through one API key, rendered in the cloud or locally.
- [Media Download](https://skills.varg.ai/skills/media-download.md): Save any video by link (X, YouTube, Instagram, TikTok, 1800+ sites) or Pinterest images as references, locally, no key.
- [Templates Gallery Ops](https://skills.varg.ai/skills/varg-templates-section.md): Internal runbook for the varg app Templates gallery: publish renders, preview clips, frame-0 posters, shelves.
- [HyperFrames CLI](https://skills.varg.ai/skills/hyperframes-cli.md): Drive the HyperFrames CLI: scaffold, check, preview, snapshot, edit the timeline, render locally or in the cloud.
- [HyperFrames Registry](https://skills.varg.ai/skills/hyperframes-registry.md): Pull any of ~450 ready-made blocks into a video as editable source: transitions, titles, captions, charts, 3D.
- [HyperFrames Media Use](https://skills.varg.ai/skills/hyperframes-media-use.md): Find or make every asset a video needs: music, SFX, voiceover, images, logos, avatars, transcripts, grades.
