Rive · .riv · State Machines · HTML Wrapper

Convert Rive
Animations to MP4

Wrap your .riv file in an HTML page with the Rive runtime, zip it, and upload. Animation Machine renders it frame-by-frame and adds music, captions, and voiceover.

1 free render · $5/month after · Cancel anytime
How it works
🎨
Wrap .riv in HTML
Canvas + Rive runtime CDN
Upload ZIP + render
Frame-by-frame in Chromium
🎬
Download MP4
With music and captions
Everything you need for Rive to MP4
🖥️
Real Rive runtime rendering
Animation Machine loads your HTML wrapper in a full Chromium browser — which runs the actual Rive JavaScript runtime. The animation plays exactly as it would in a production app, then gets captured frame-by-frame.
🎵
Background music library
Search 500,000 free CC0 tracks by mood — Cinematic, Upbeat, Lo-fi, Corporate, Dramatic, Ambient, and more. Upload your own audio too. Music loops and trims to your animation's exact length.
🎙️
AI voiceover + captions
Add a narration script and Kokoro TTS generates it locally in 14 voices. Whisper AI auto-transcribes and burns captions into the output. Perfect for demo reels and portfolio videos.
State machine loops work
Idle loops and auto-advancing state machines render correctly. Animation Machine captures frames as the runtime plays them — so looping animations, enter transitions, and continuous motion all work as expected.
Rive to MP4 — Common Questions
How do I prepare a Rive animation for Animation Machine?
Rive animations are .riv binary files that require the Rive runtime to play. Create a simple HTML file that embeds your .riv file using the Rive JavaScript runtime (from rive.app/runtime), place both files in a folder, and zip it. Upload that ZIP to Animation Machine.
What does a minimal Rive HTML wrapper look like?
A minimal wrapper includes a <canvas> element, imports the Rive runtime via CDN, and instantiates Rive with your .riv file path and the canvas as the layout. The Rive runtime handles playing the default state machine or animation on load.
Will state machine animations render correctly?
State machine animations that auto-advance (idle loops, entry transitions) will render correctly because Animation Machine steps through frames as the browser plays them. Animations that require user input (click, hover triggers) will stay in their default state unless you configure the state machine to auto-transition.
Can I add background music to my Rive animation video?
Yes. Search our 500,000-track CC0 music library or upload your own audio. The music is looped and trimmed to exactly match your animation's duration.
Can I add a voiceover or captions to the converted video?
Yes. Use Kokoro TTS (14 voices) to add narration from a text script. Whisper AI will then auto-transcribe it and burn captions into the output MP4. Or provide your own audio and let Whisper caption it.
What resolutions and formats can I export to?
Export at 1920×1080, 1280×720, 1080×1920 (portrait), 1080×1080 (square), or 3840×2160 (4K). Output as MP4 (H.264) or animated GIF. Quality: Draft, Standard, High, Max.
How much does Animation Machine cost?
Animation Machine is $5 per month with unlimited renders. No per-export fees. Cancel anytime from your account settings.
Live demo
Sign in to continue
Sign in with Google to start — 1 free watermarked render included. Subscribe for $5/month to unlock unlimited clean exports.