CSS · GSAP · Lottie · Framer · Rive · Spline · ZIP Upload · MP4
HTML Animation to MP4 —
Any Browser Animation
The fastest way to convert HTML animation to video. Upload a ZIP or single HTML file — any animation that runs in Chrome renders frame-perfect into a clean MP4 or GIF, with AI audio and captions included.
1 free render · $5/month after · Cancel anytime
How to convert HTML animation to MP4
ZIP your animation
HTML + assets, relative paths
→
Upload and render
Frame-by-frame in Chromium
→
Download MP4
1080p H.264, ready to share
Supported animation types
Any HTML animation converts to video
CSS @keyframes
Transitions, keyframe sequences, and the Web Animations API — all rendered exactly as in a browser.
GSAP / GreenSock
Timeline-based GSAP animations exported as HTML ZIP render precisely, including ScrollTrigger scenes with auto-scroll.
Lottie / Bodymovin
After Effects exports via Bodymovin, Jitter files, and any Lottie JSON played by lottie-player all convert cleanly.
Framer
Export your Framer prototype as HTML, ZIP it, and upload. Page transitions and entrance animations render correctly.
Rive & Spline
Embed your Rive canvas or Spline scene in an HTML file and upload. State machines that auto-play on load will render.
SVG & Three.js
Animated SVGs and Three.js WebGL scenes run in the full Chromium renderer — no special setup required.
Features
More than a converter
AI voiceover — 14 voices, local
Type a script and Kokoro TTS narrates your animation in one of 14 English voices. Runs entirely on-server — no ElevenLabs, no OpenAI, no per-character fees. Auto-ducks under background music.
Auto-captions from Whisper
Local Whisper transcribes spoken audio and burns time-synced captions into every frame. Four styles — subtle lower-thirds to bold TikTok text. No API costs, no audio uploads.
Frame-perfect Chromium rendering
Animation Machine steps a real headless Chromium browser one frame at a time — no approximations, no dropped frames, no quirks. If it plays in Chrome, it renders correctly here.
500,000 CC0 music tracks
Search Freesound's CC0 catalog from inside the app — cinematic, lo-fi, ambient, upbeat. Music loops or trims to match your animation's exact duration. No attribution required.
FAQ
HTML Animation to MP4 — Common Questions
How do I convert an HTML animation to MP4?
Package your HTML file and all its assets (CSS, JavaScript, fonts, images) into a ZIP file with relative paths. Upload the ZIP to Animation Machine, choose your resolution and format, then click Render. Your MP4 is ready to download in 1–3 minutes.
What types of HTML animations are supported?
Any animation that runs in a modern browser: CSS @keyframes and transitions, GSAP timelines, Lottie/Bodymovin JSON, Framer HTML exports, Rive canvas embeds, Spline scenes, Three.js WebGL, animated SVGs, and the Web Animations API. If it plays in Chrome, it renders here.
Do I need to install anything?
No. Animation Machine is fully browser-based. Upload your ZIP, pick your settings, download your MP4. No software to install, no command line, no FFmpeg setup required on your end.
Can I export to GIF instead of MP4?
Yes. Animation Machine supports both MP4 and animated GIF. GIF works well for short loops under 5 seconds and embeds in email or Slack. MP4 is better for longer animations — smaller file size, much higher quality.
What output resolutions are available?
1080p (1920×1080), 720p (1280×720), vertical 1080×1920 for TikTok and Reels, square 1080×1080 for Instagram, and 4K (3840×2160). All from the same upload — no re-render required to switch format.
How long does it take to convert HTML animation to video?
Typically 1–3 minutes for a standard animation. Complex scenes with heavy JavaScript or many frames may take a bit longer. You can track frame-by-frame progress in real time from the app.
How much does it cost?
One free watermarked render to try — no credit card required. Pay-per-render credits start at $1/render. Unlimited clean renders are $5/month. Cancel anytime from your account settings.
Also available