What each framework is
Remotion is a framework for making videos with React. Its core idea, in its own docs, is that a video is a function of images over time: a React component receives the current frame number and returns what that frame should show. Around the core sit Remotion Studio for previewing and rendering, the Remotion Player for embedding compositions in React apps, server-side rendering with Node.js, client-side rendering in the browser and Remotion Lambda for rendering on AWS. The GitHub repository was created in June 2020, has about 65,000 stars and shipped version 4.0.536 on October 16, 2026.
HyperFrames is an open-source framework from HeyGen that turns HTML, CSS, media and seekable animations into deterministic MP4 videos. A composition is an index.html file with data attributes that say when each element is on screen; the renderer pauses the page's animation timeline, seeks it to each exact moment in headless Chrome and encodes the frames with FFmpeg. Animations can come from GSAP, CSS animations, Lottie, Three.js, Anime.js or the Web Animations API through adapters. Its repository has about 66,500 stars, and its README says the project was inspired by Remotion.
How you write a video
HyperFrames' own comparison guide shows the same three-second title card in both tools. In Remotion it is a React component that reads useCurrentFrame() and computes opacity with interpolate() over frame ranges, registered as a Composition with a frame count and frame rate. In HyperFrames it is one HTML file: data-start and data-duration attributes declare when the clip is visible, and a paused GSAP timeline registered on window.__timelines declares how it moves, timed in seconds.
The guide is candid about the trade-off. Remotion's model is one pure function of the frame number, with no timeline to register. HyperFrames asks you to follow rules, such as a paused timeline, no wall-clock timing and no unseeded randomness, and the guide says a composition breaks quietly if you miss one. In return, existing HTML, CSS and GSAP or Lottie animations usually drop in close to as they are, while in Remotion they have to be rewritten as React components. Remotion's server-side renderer also bundles the project with Webpack before rendering; HyperFrames needs no build step.
Working with AI coding agents
Both projects now target coding agents directly. Remotion's docs cover starting a project for an agent with npx create-video --yes --blank and using it with Claude Code, Codex, OpenCode and other agents. Its Agent Skills install with npx skills add remotion-dev/skills and include skills for best practices, creating and rendering videos, captions, maps, interactivity, upgrades and the Studio. Remotion also publishes Markdown versions of its docs for agents.
HyperFrames was designed for agents from the start. Claude Code users install a versioned plugin from the HyperFrames marketplace, and other agents that support skills install them with npx skills add heygen-com/hyperframes. It ships 21 published skills led by a /hyperframes router that walks the agent through planning, writing valid HTML, wiring seekable animations, adding media, linting, previewing and rendering, and a human can then edit the same file in HyperFrames Studio.
Rendering options
Remotion renders locally or on a server with Node.js, in the browser with @remotion/web-renderer, which encodes with WebCodecs and supports a subset of tags and CSS properties, and on AWS with Remotion Lambda. Remotion's docs say you only pay AWS while rendering and that Lambda suits videos under about 80 minutes at Full HD, the point where Lambda's 15-minute timeout is reached. Rendering on Vercel is also documented. Remotion's Google Cloud Run package is marked as alpha and not actively developed.
HyperFrames renders with its CLI locally or in CI, from a Node backend with the @hyperframes/producer package, on AWS Lambda or Google Cloud Run in your own account, through hosted templates on Vercel, Cloudflare or Modal, or on HyperFrames Cloud, HeyGen's managed rendering service, after signing in with a HeyGen account or API key. It needs Node.js 22 or later and FFmpeg for local rendering. HyperFrames' docs do not publish pricing for HyperFrames Cloud.
Licensing
This is the biggest practical difference. HyperFrames is Apache 2.0, so commercial use carries no seat count, render fee or license review.
Remotion is source-available under its own license. The Free License covers individuals, for-profit organizations with up to 3 employees, non-profits, and anyone evaluating Remotion before commercial use, and it allows commercial use. Any other organization needs a Company License. Under either license you may not copy or modify Remotion's code to sell, rent, license or sublicense your own derivative of it. A pull request preparing Remotion 5.0 says its new license will also count contractors toward team size and bind the Company License to new terms and conditions.
Pricing
HyperFrames is free; you pay only for your own infrastructure, such as AWS when rendering on Lambda.
Remotion's Company License has two usage options. Remotion for Creators costs $25 per seat per month and is meant for low-volume videos made through coding and prompting and for motion design systems built locally. Remotion for Automators costs $0.01 per render with a $100 monthly minimum, which covers 10,000 renders, and is meant for products such as video editors, prompt-to-video apps, automated video creation or embedding the Remotion Player; developers on automation projects do not need a seat. A Company License includes prioritized support and $250 in Mux credits for new Mux customers. The Enterprise License starts at $500 a month and adds a private Slack or Discord, a monthly consulting session, custom terms and billing, compliance forms and the Editor Starter.
Telemetry
Remotion's telemetry exists for licensing. Server-side renders send an event only when the licenseKey option is set and the render succeeds, while client-side renders with @remotion/web-renderer always send one, including the end user's IP address. Events carry the license key, IP address, whether a video or still was rendered and whether it ran in production; Remotion says no content is sent. In Remotion 5.0, companies on Remotion for Automators must set licenseKey and opt into telemetry.
The HyperFrames CLI collects usage telemetry unless you opt out: command names, render performance, error names and coarse system information, including the name of a detected coding agent, with your HeyGen account e-mail linked only after you sign in. HYPERFRAMES_NO_TELEMETRY=1, DO_NOT_TRACK=1 or hyperframes telemetry disable turns it off.
Maturity and moving between them
HyperFrames' guide says plainly that Remotion is older and much more established, with more templates, tutorials, answered questions and production history, and that Remotion Lambda is a more mature, heavily documented system than its own. For React teams, Remotion reuses existing components, design systems, charting libraries and typed, validated composition inputs.
HyperFrames offers a migration skill, installed with npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes. It maps useCurrentFrame and interpolate onto timeline tweens and Sequence onto clips, and HyperFrames estimates that about 80% of a typical composition translates mechanically. React state built on useState or useEffect, async metadata and third-party React UI libraries are flagged instead of translated, and the skill renders both versions to compare them frame by frame.
Who should pick which
- Pick Remotion if your team already writes React and wants to reuse its components, libraries and typed inputs in video.
- Pick Remotion if you need the most established Lambda rendering, the embeddable Remotion Player or the paid Editor Starter, and the license cost fits your team size and render volume.
- Pick HyperFrames if your source material is already HTML, CSS, GSAP or Lottie, or you want agents to write and edit compositions without React or a build step.
- Pick HyperFrames if you need permissive Apache 2.0 terms, for example to ship video rendering inside a product without seat or per-render fees.
The Bottom Line
HyperFrames and Remotion solve the same problem, video from web code, with different inputs and terms. Remotion is the mature React option with a richer ecosystem and a license that is free for small teams but paid for larger companies and automated products. HyperFrames is the newer HTML-first, agent-first option under Apache 2.0, with a candid migration path from Remotion. The fastest way to decide is to build one short composition in each with your own agent and source material.