Render modes: Quality (frame-stepped) is the recommended mode. It renders offline on a virtual clock — the converter freezes time inside your animation, advances it exactly 1/fps per frame, and captures every single frame. The result is perfectly smooth at any resolution and frame rate, no matter how slow the machine is. The trade-off is render time: expect a few minutes for a 10s clip at 4K (a live frame counter shows progress and ETA). Realtime records live like a screen capture — fast (a 10s clip takes ~10s), but if the machine can't snapshot fast enough, frames get duplicated and motion stutters. Use it for quick drafts only.
Resolution & bitrate: Output goes up to 4K (3840×2160 for 16:9) at up to 80 Mbps. Captures render at full output resolution — text and vectors stay sharp because the DOM is rasterized directly at 4K, not upscaled. At 80 Mbps a 4K clip is roughly 10 MB per second of video, and the file is assembled in memory, so very long maxed-out exports can get heavy.
Color accuracy: All exports are MP4, encoded with WebCodecs (H.264) and tagged with color-space metadata (a colr box) when the encoder reports it, so video players interpret colors the same way the browser rendered them instead of guessing. If the browser has no MP4 encoder available, Realtime mode automatically falls back to WebM as a last resort. Note that all consumer video is chroma-subsampled (4:2:0), so razor-thin saturated edges soften slightly; rendering at 4K minimizes this.
About FPS: In Quality mode the FPS setting is exact — 30 or even 60 fps works on any machine because rendering isn't real-time. In Realtime mode it controls capture pacing, and slow machines will duplicate frames to keep timing correct.
What captures correctly: CSS keyframe animations, transitions, and JS animations driven by requestAnimationFrame, setTimeout/setInterval, performance.now() or Date.now() — Quality mode virtualizes all of these clocks. Cross-origin images and fonts may not render — use system fonts or inline assets as data URIs. <video> elements and Web Audio aren't time-stepped.
Tip: press Ctrl+Enter in the editor to reload preview.