Remotion

What's Changed

• Rspack is not experimental anymore, still opt-in by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9889
• @remotion/renderer: Render multiple stills: --frames=0,10,20 by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9888
• @remotion/renderer: Fix parallel browser downloads by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9882
• @remotion/studio: Fix seeking in read-only Studio by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9905
• @remotion/studio: Improve narrow preview layout by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9900
• @remotion/studio: Align update button colors by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9898
• @remotion/studio: Improve unsymbolicated error overlay by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9890
• @remotion/studio: Open asset picker when adding assets by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9865
• @remotion/studio-server: Resolve composition source locations by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9894
• @remotion/studio-server: Import staticFile when changing media sources by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9887
• @remotion/studio-server: Resolve JSX elements by column by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9872
• @remotion/studio-server: Implement Studio Protocol installation by @samohovets in https://github.com/remotion-dev/remotion/pull/9878
• @remotion/studio-server: Limit Studio Protocol request bodies by @samohovets in https://github.com/remotion-dev/remotion/pull/9863
• @remotion/studio-protocol: Document the Studio Protocol by @samohovets in https://github.com/remotion-dev/remotion/pull/9881
• @remotion/studio-protocol: Adopt the protocol in Remotion Elements by @samohovets in https://github.com/remotion-dev/remotion/pull/9879
• @remotion/studio-protocol: Stabilize Element install contract by @samohovets in https://github.com/remotion-dev/remotion/pull/9832
• @remotion/studio-protocol: Fix malformed response classification by @samohovets in https://github.com/remotion-dev/remotion/pull/9860
• @remotion/studio-protocol: Rename the drag-and-drop package by @samohovets in https://github.com/remotion-dev/remotion/pull/9877
• @remotion/browser-studio: Support saving sequence props by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9897
• @remotion/browser-studio: Support sequence prop subscriptions by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9883
• @remotion/browser-studio: Support default props subscriptions by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9867
• @remotion/web-renderer: Support raster URL masks by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9861
• @remotion/promo-pages: Fix pricing card alignment by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9895
• @remotion/promo-pages: Render homepage videos after hydration by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9893
• remotion.dev/convert: Preview rotation and mirroring in player by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9859

Docs

• Remove redundant Sequence wrappers from examples by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9862

Internal

• @remotion/studio-protocol: Test Element installation in a clean Studio project by @samohovets in https://github.com/remotion-dev/remotion/pull/9880
• Skills: Format JSX examples by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9873
• @remotion/cli: Pin skills CLI to 1.5.20 by @JonnyBurger in https://github.com/remotion-dev/remotion/pull/9868

Full Changelog: https://github.com/remotion-dev/remotion/compare/v4.0.501...v4.0.502

<p align="center">

<a href="https://github.com/remotion-dev/logo">

<picture>

<source media="(prefers-color-scheme: dark)" srcset="https://github.com/remotion-dev/logo/raw/main/animated-logo-banner-dark.apng">

<img alt="Animated Remotion Logo" src="https://github.com/remotion-dev/logo/raw/main/animated-logo-banner-light.gif">

</picture>

</a>

</p>

Discord Shield

NPM Version

NPM Downloads

<a href="https://twitter.com/remotion"><img src="https://img.shields.io/twitter/follow/remotion?label=Twitter&color=black" alt="Twitter"></a>

Video tools for the agent era.

Video Creation

• Make videos agentically: Turn your idea into a video using your coding agent.
• Make videos interactively: Edit and animate using drag and drop.
• Make videos programmatically: Connect to data, and manage complexity with code.

React Code is the source of truth. Switch your workflow at any point.

Video Automation

• Design systems: Create a library of animated assets for your organization.
• Batch rendering: Render millions of videos on your own infrastructure.
• Applications: Publish a simple tool or a complex video editor.

Get started

If you already have Node.JS installed, type

npx create-video@latest

to get started. Otherwise, read the installation page in the documentation.

Discover Remotion

Remotion is extensively documented over more than 1000 pages.

• Get Started
• Installation
• Agent Skills
• Prompts
• Templates
• Components
• Effects
• Shapes
• Transitions
• Sound Effects
• Captions
• Fonts
• Rendering
• Node.js APIs
• Lambda
• Vercel
• Client-side rendering
• Comparison of options
• Making apps
• Player
• Editor Starter
• Mediabunny
• Community
• Discord
• Experts
• Resources
• Contributing
• Follow us on X, YouTube, Instagram, LinkedIn
• Commercial
• License
• Store
• About Remotion
• Showcase
• Help
• Support
• Discord
• Search
• Ask AI
• GitHub Issues

Documentation

Documentation: remotion.dev/docs

API Reference: remotion.dev/api

License

Be aware of that Remotion has a special license and requires obtaining a company license in some cases. Read the LICENSE page for more information.

Contributing

Please read CONTRIBUTING.md to learn about contributing to this project.