Loading video tools…
Loading video tools…
Create a seamlessly looping video by repeating it a chosen number of times.
Your video never leaves your browser. All processing runs locally using Canvas and MediaRecorder.
Drop a video to loop
or click to browse — max 500 MB · MP4, WebM, MOV, AVI
Your video files never leave your device
All processing runs directly in your browser using built-in Web APIs — the Canvas API, Web Audio API, and WebAssembly. Nothing is uploaded to any server. There is no account, no email, and no data retention. You can verify this yourself: open your browser's DevTools Network tab and watch zero outbound file requests while the tool processes your video files.
GDPR-friendly · Works offline after page load · No file size limits beyond your device memory
Upload your video
Drag and drop or click to select your video file.
Choose repeat count
Pick how many times the clip should repeat.
Click Loop Video
The looped clip is rendered instantly in your browser.
Download the result
Save your looped clip.
Understanding when and why to loop videos helps you work more efficiently. Here are the most common scenarios where video looping solves real problems:
You captured a 2-second action shot — someone jumping, a drink being poured, confetti falling — and want to turn it into a 6-second Instagram Story or TikTok. Loop the clip 3 times so viewers see the action repeat, creating that hypnotic boomerang effect. Most social platforms auto-loop video playback anyway, but repeating it in the file itself ensures it plays through multiple iterations even if someone pauses or scrubs the timeline.
Your homepage hero section features a 5-second video of clouds drifting or abstract shapes morphing. If the video ends after 5 seconds, visitors see a static final frame or a jarring restart. Loop it 2-3 times in the file (creating a 10-15 second video) then set the HTML5 video element to loop infinitely. This gives enough duration to feel continuous without forcing visitors to download a massive file. A 5-second clip at 1080p might be 2 MB; looped 3 times it becomes 6 MB — manageable for fast page loads.
You have a 3-second logo reveal animation that you want to play for 12 seconds during a presentation or video intro. Rather than re-rendering the animation 4 times in After Effects or Blender (which is slow and requires the project files), loop the exported 3-second video 4 times. This is faster and maintains the exact timing and quality of the original render. Afterward, you can add music or voiceover over the full 12-second looped result.
You created a 15-second product demo video showing your item's key features. The display screen at a trade show booth or retail kiosk plays continuously for 8 hours a day. Looping the 15-second clip 4 times creates a 1-minute video that feels less repetitive than the same 15 seconds over and over (viewers might see it restart 4 times per minute vs 1 restart per minute). The longer loop interval makes the playback feel less monotonous for anyone watching for more than 30 seconds.
You converted an animated GIF to MP4 using the MP4 to GIF tool (or vice versa), but the resulting video is only 2 seconds long — one loop of the GIF. GIFs typically loop forever when embedded, but videos play once and stop unless explicitly set to loop. To mimic the GIF's endless-loop feel, repeat the video 5-10 times in the file itself, creating a 10-20 second video that plays through multiple cycles before restarting. This works better for email embeds or platforms where you don't control the video player settings.
A cinemagraph is a still photo where one small element moves — steam rising from a coffee cup, a flag gently waving, water flowing. These are typically 3-5 second clips designed to loop seamlessly. For web use, loop the cinemagraph 2-3 times in the file (6-15 seconds total), then set the video player to loop infinitely. This ensures smooth playback even on platforms or browsers that don't support seamless gapless video looping, because the file itself contains multiple repetitions with minimal re-encoding artifacts.
You recorded a 10-second screencast demonstrating a software feature — maybe clicking through a menu or filling out a form. For a training module, you want learners to see the same action 3 times in a row to reinforce the steps. Rather than recording it 3 times separately (which risks slight inconsistencies in timing or cursor position), record it once perfectly and loop it 3 times. This guarantees identical repetition and saves you the time of re-recording or manually splicing in an editor.
Video looping in the browser relies on the Canvas API, HTMLMediaElement (the <video> tag), and MediaRecorder API to decode, stitch, and re-encode your footage without server involvement. Understanding how this works explains why the tool is instant, private, and works offline.
When you upload a video, the browser's File API reads it into memory as a binary Blob. This Blob is assigned as the source of an invisible <video> element, which the browser decodes using its built-in codec support (H.264, VP8, VP9, AV1, depending on the container and your browser version). The video doesn't render on-screen, but it's fully loaded and seekable in memory.
To loop it, we create an HTMLCanvasElement with the video's native dimensions (e.g., 1920×1080 for full HD). We then use requestAnimationFrame to draw the current video frame onto the Canvas at 30 or 60 FPS, synchronized with the video's playback. Each time the video reaches its end, we seek it back to time 0 and continue drawing, effectively concatenating the same footage N times without a gap. The Canvas captures this continuous loop sequence as if it were a single long video.
Once all loops are drawn (e.g., a 5-second clip looped 3 times = 15 seconds of Canvas frames), the MediaRecorder API encodes the Canvas stream into a compressed video file. Your browser's MediaRecorder uses its default codec — typically VP9 in a WebM container on Chrome/Edge, or H.264 in an MP4 container on Safari. The bitrate and quality settings are controlled by the browser and generally target a balance between file size and visual quality (5-10 Mbps for 1080p, depending on the implementation).
1. File Upload & Decode — The File API reads your video from disk into browser memory as an ArrayBuffer. The browser's native decoder unpacks the compressed video (JPEG frames for MOV, VP8/9 for WebM, H.264 for MP4) into raw pixel data that can be rendered or manipulated.
2. Canvas Setup — A Canvas element is created matching the video's resolution. This Canvas acts as a framebuffer where each video frame will be drawn during playback.
3. Frame-by-Frame Drawing Loop — Using requestAnimationFrame, the tool draws the current video frame onto the Canvas at the display's refresh rate (typically 60 FPS). When the video reaches its endpoint (e.g., 5 seconds), it seeks back to time 0 and continues drawing until the specified loop count is reached (e.g., 3 loops = 15 seconds total).
4. MediaRecorder Encoding — The Canvas is captured as a MediaStream using canvas.captureStream(). This stream feeds into MediaRecorder, which re-encodes it into a compressed video file using the browser's default codec and bitrate settings. The encoding happens in real-time as frames are drawn, not after all loops finish.
5. Blob Export & Download — Once all loops are encoded, MediaRecorder outputs a Blob containing the full looped video. This Blob is converted to a download link via URL.createObjectURL(), letting you save the file locally.
A truly seamless loop — one where the transition from the last frame back to the first frame is invisible — depends on two factors: content continuity (the last frame of your video should visually match the first frame) and keyframe alignment (the video's codec structure shouldn't force a decode delay at the loop point).
Most videos are encoded with I-frames (keyframes) every 1-2 seconds and P-frames (predicted frames) in between. When you stitch the same video end-to-end, the loop point occurs mid-GOP (group of pictures), meaning the decoder has full context and playback continues smoothly. However, if your source video has unusual keyframe spacing or variable frame rate (common in phone recordings), you may see a brief stutter or frame drop at loop boundaries. This isn't a bug in the tool — it's an artifact of how video compression works. Professional editors can create perfect loops by ensuring keyframes land exactly at the start and end of the clip during export, but most casual footage won't have this.
Browser-based looping tools prioritize simplicity and compatibility over frame-perfect control. If you need professional-grade seamless loops for commercial work (like storefront displays or broadcast graphics), use a desktop editor like Adobe Premiere, DaVinci Resolve, or FFmpeg with explicit keyframe placement flags. For web use, social media, and casual projects, the imperceptible imperfections from browser re-encoding are rarely noticeable.
All video processing happens in your browser's JavaScript runtime and Canvas rendering pipeline. The video file is read from your device's disk into browser memory (RAM) and never uploaded to a remote server. The looped output is generated entirely client-side and exists only in your browser's memory until you click Download, at which point it's saved directly to your local filesystem. We have no backend API, no video processing servers, no CDN cache, and no database where files could be stored — the architecture makes it impossible for us to access your videos, even if we wanted to.
This client-side approach also means the tool works offline (after the initial page load caches the JavaScript). If you lose internet connection mid-loop, processing continues uninterrupted because nothing needs to communicate with a server. The privacy guarantee isn't just a policy — it's a technical reality enforced by the tool's architecture.
Unlike most online tools, Toolivon processes everything directly in your browser using the Web APIs built into Chrome, Firefox, Safari, and Edge.