GIF to Sprite Sheet: Convert GIF and Video to PNG | Spritfy
Convert GIF or video to a PNG sprite sheet in your browser. Trim frames, remove backgrounds, set cell size and export JSON with Spritfy’s free Sprite tool.
Convert a GIF or video to a sprite sheet by opening it in Sprite, keeping the frames you need and downloading a PNG grid. Sprite is free to use. You can also export a GIF or APNG for playback, or include JSON with the PNG to describe frame positions and timing.
This workflow turns an existing animation into game assets. If you also want to simplify its colors and edges into pixel art, use the optional Pixelizer step below.
1. Open a GIF or a short video
Import the file in Sprite. GIF frames are decoded as an animation; MP4 and WebM videos use the browser’s video decoder. For video, the current tool samples one frame every 0.1 seconds, giving an initial 10 FPS sequence. Changing playback FPS afterward changes speed, not the number of frames extracted.
Prepare a short source clip before importing a long recording. The tool reads the video before you trim its frame list. A file must be 64 MB or less, and large frame dimensions or counts can still exceed available memory.
2. Trim, select and order your frames
Play the extracted animation, then trim unwanted frames from its beginning and end. Click a frame to select it, Shift-click for a range, or Ctrl/Command-click to add or remove individual selections. Drag frames to change their order.
Decide whether you are exporting the entire sequence or only selected frames. Selecting frames alone does not limit the export: enable the selected-frames-only toggle in the export panel to save just that selection. The panel shows the number of frames that will be saved. A selected range is useful when one file contains several actions, such as idle, walk and attack.
3. Remove duplicates without losing important poses
Use duplicate removal or the frame reduction controls when the sequence contains unnecessary repeated images. Increase the duplicate range cautiously: a higher value can treat slightly different poses as identical.
A pause before an attack or an impact frame may be intentional. After removing frames, review both the action and playback speed. Sprite preview and animation exports use the chosen FPS; do not assume that different frame delays in the original GIF will remain unchanged.
4. Remove a background and inspect the edges
For a solid backdrop, select its color with the eyedropper and enable chroma key. Increase tolerance gradually while checking eyes, clothes and effects that share the background color. Despill can reduce remaining background color along the edge.
Chroma key affects the preview and exports while the original frames remain intact; applying it to the frames changes their pixels and can be undone. Corner-connected removal is another option for a background connected to the four corners. It will not automatically remove every enclosed patch inside a character’s silhouette.
5. Check the loop, size and anchor
Compare the last frame with the first before calling an animation a loop. Reverse and ping-pong can help with an oscillating effect, but an attack played backward can look wrong. Check whether the feet and body stay at the intended reference point.
Anchor alignment can reduce unwanted frame movement. Review jumps and deliberate vertical motion before applying it. Choose a consistent cell size that leaves room for the complete motion, including weapons or effects, and check the export preview for clipping.
6. Choose columns, padding and export format
Sprite lets you set columns, outer padding and spacing between frames. Frames follow their current order from left to right, then top to bottom. Padding is space around the sheet; spacing is the gap between cells.
For a hypothetical eight-frame animation with 128×128px cells, four columns, zero padding and zero spacing, the sheet has two rows and measures 512×256px. The final row can contain empty cells when the frame count does not fill the grid. Exclude those cells from playback.
- PNG sheet: one image containing the animation’s cells.
- PNG with JSON: enable the game-engine JSON option for TexturePacker JSON(Hash) frame coordinates and durations calculated from the chosen FPS. Save PNG and JSON separately or together in one ZIP.
- GIF or APNG: an immediately playable animation for reviewing or sharing the sequence. APNG can retain partial transparency.
A plain PNG does not contain playback timing. Record cell size, columns, occupied frame count and FPS when handing it to another person. For layout and anchor details, read sprite sheet size, order and anchors.
7. Add pixel-art styling when you need it
Export the cleaned animation as GIF and open it in Pixelizer to adjust long side, color count and outlines. Start with a readable silhouette, then compare palette and edge settings one at a time. The Pixel Perfect and color-outline walkthrough explains those controls.
This optional step is free: importing your own source file into Pixelizer uses no credits and needs no sign-in, because processing runs in your browser. You can also preview the built-in 3D sample first. Exporting Pixelizer results, including exports from the sample, and saving work to your account require sign-in. Credits are used only for image-to-3D generation; see plans and your balance for one-month passes without automatic renewal.
Troubleshooting GIF and video sprite sheets
- Video does not open: check its codec, not only its extension. Try a browser-playable MP4 with H.264 or WebM.
- Import runs out of memory: shorten or reduce the resolution of the source before importing. Trimming after import cannot reduce the work needed to read it.
- Background removal cuts holes in the subject: lower tolerance or compare corner-connected removal; inspect every pose.
- Animation looks faster after cleanup: review the chosen FPS and whether an intentional repeated pose was removed.
- Only one PNG downloads: that is the complete sheet. Inspect its grid instead of expecting a separate download for each frame.
- JSON does not download separately: choose ZIP to receive the PNG and JSON together if the browser blocks multiple downloads.
Reopen the final file and confirm frame count, cell size, transparency, order and playback settings. Continue with the sprite sheet guide, or follow the 3D model to pixel sprites workflow when your source is a model rather than a GIF.
Try the settings from this article on your own source.
Sprite tools