Video to Sprite Sheet

Most video-to-sheet converters grab frames at a fixed interval and stop there. That works for a one-shot effect. For a walk cycle it leaves you a sheet that stutters where it loops, a green halo on every outline, and a character that jitters because each frame was cropped on its own. This tool handles those three problems for you: it finds the motion's period, keys out the backdrop with edge despill, and crops every frame with one shared box.

How to use the Video to Sprite Sheet

1. Drop an MP4, WebM or MOV. A character filmed or rendered on a flat green, magenta, blue or white backdrop gives the cleanest result. WebM with an alpha channel keeps its transparency in Chrome and Edge.
2. Set the start and end of the part you want (up to 30 seconds) and the capture size, then press Extract frames. The clip plays once while every decoded frame is captured.
3. If the motion repeats, the tool finds one full cycle and selects it. Choose how many frames the sheet should have; they are spread evenly through the cycle, and the closing frame is left out so the loop has no hitch.
4. Check the background key. Auto reads the backdrop colour from the frame border. If it gets it wrong, click the backdrop in the source frame. Adjust tolerance, edge softness, despill and the 1px shrink while the result updates live.
5. Set the max frame size, and turn on Pixelate if you want hard edges and one shared palette for every frame.
6. Export the PNG sheet with Aseprite, Phaser/TexturePacker, Godot or CSS data, an animated GIF, or a ZIP with all of it plus single frames.

What you get

• PNG sprite sheet with a transparent background, laid out in a grid (auto or fixed columns, optional padding).
• Frame data as Aseprite JSON, Phaser/TexturePacker JSON (hash or array), a Godot 4 SpriteFrames .tres, CSS sprite classes with a stepped keyframe animation, or Unity slicing settings.
• Animated GIF at any integer scale, transparent or on black/white.
• ZIP with the sheet, GIF, every data format and each frame as its own PNG.

Which engines it fits

• Godot 4: drop the PNG and the .tres into the same folder, then assign the SpriteFrames to an AnimatedSprite2D. If the PNG lives elsewhere, edit the res:// path on the first line.
• Unity: import the PNG as Sprite (Multiple), set Filter Mode to Point, and slice with Grid By Cell Size using the numbers in the Unity settings file.
• Phaser 3 and PixiJS: load the PNG with the TexturePacker JSON (hash) as an atlas. The JSON also lists the animation's frame names in order.
• GameMaker, Defold, Construct, RPG Maker: import the PNG as a strip or grid with the frame size shown under the export settings.

Tips from making games with it

• Film or render against a colour that does not appear on the character. Magenta is safest for green-clad heroes; green for anything red or pink.
• Leave a margin around the character. If a limb leaves the frame, the shared crop cannot bring it back.
• For walk and run cycles, 8 frames at 10–12 fps reads well at 32–64 px. Idles can use 4–6 frames with Ping-pong in the Animation Previewer.
• If outlines keep a tint after keying, raise Edge softness slightly and keep Despill on. Turn on Shrink 1px only when a coloured ring remains.
• Pixelate at the final in-game size. Downscaling a 512 px frame to 48 px with one shared palette looks far better than scaling an already-pixelated sheet.

Use cases

• Turning rotoscoped reference footage into placeholder animation for a prototype.
• Extracting a looping cycle from an AI video model's output of your character on a green screen.
• Converting a Blender or Spine render to a sprite sheet without setting up a render pipeline.
• Getting effects (smoke, magic, water) rendered as video into a game as a sprite sheet.

FAQ