Skip to content
keyMotio

GIF to Sprite Sheet

Turn an animated GIF into a sprite sheet, or a sprite sheet back into a GIF. The sheet comes with JSON metadata in Aseprite's format, which Phaser, PixiJS, Godot and Unity already read — so the animation keeps each frame's duration instead of losing it. Everything runs in your browser and no file is uploaded.

Which way

Leave it at 0 for a near-square grid, which is what wastes the least texture space.

Frame size

The sheet's area is frames × width × height no matter the grid, so scaling down is the only way to make a long animation fit.

Spacing between cells stops a game engine's bilinear filtering from dragging in pixels from the neighbouring frame. Margin surrounds the whole sheet.

Background

How to turn a GIF into a sprite sheet

  1. 1

    Pick the direction

    GIF to sheet lays every frame out on a grid. Sheet to GIF does the opposite: you give it the grid and it rebuilds the animation.

  2. 2

    Open your file

    A GIF, animated WebP, APNG or animated AVIF in one direction; a PNG, WebP or JPG sheet in the other.

  3. 3

    Set up the grid

    Leave the columns at zero for a near-square grid, or fix them yourself. Add spacing between cells if your engine needs it, and scale the frames down if the sheet would come out too large.

  4. 4

    Download

    With the metadata on, you get the PNG and the JSON in a ZIP, because the JSON refers to the image by name and separating them breaks the link.

What makes it different

  • The frame durations survive

    A bare sprite sheet loses the one thing that made it an animation: how long each frame lasts. The JSON carries every duration, so the animation can be rebuilt exactly — in an engine or back here.

  • Aseprite's format, not one of our own

    The metadata uses the format Aseprite exports, which Phaser, PixiJS and the Godot and Unity importers already read. Inventing our own would have meant you writing an adapter.

  • It tells you the size before it builds

    The sheet's area is the number of frames times the frame size, no matter how you arrange the grid — so a long animation simply cannot fit in one image. The resulting dimensions are shown as you change the options, worked out by the same code that builds it.

  • Cutting handles a half-empty last row

    Five frames in a 3×2 grid leave an empty cell. Tell it how many frames there really are and that cell is skipped, instead of a blank frame turning up at the end of your animation.

  • Spacing that engines actually need

    Padding between cells stops bilinear filtering from dragging pixels in from the neighbouring frame, which is the usual cause of thin seams around sprites. Margin around the sheet is there too.

Supported formats

Into a sheet: animated GIF, animated WebP, APNG and animated AVIF. Out: a PNG sheet, transparent unless you pick a background, plus optional JSON. The other way round takes any PNG, WebP or JPG sheet and produces an animated GIF.

Frequently asked questions

What is a sprite sheet for?
Game engines draw animations from a single texture rather than from a file per frame: one upload to the GPU, one image to manage. It is the standard way to ship 2D animation in Godot, Unity, Phaser and the rest.
Do I need the JSON?
If your engine reads Aseprite JSON, yes — it saves you typing the frame rectangles and the timings by hand. If you are laying the sheet out in a uniform grid and setting the speed in code, the PNG alone is enough.
Why can I not make the sheet a single long row?
You can, by fixing the columns to the frame count, but it rarely helps: the area is the same either way, and very wide textures hit limits on older GPUs. A near-square grid is the safe default.
Why does it say the sheet would be too big?
Because the area is frames × width × height, and no grid changes that. A 200-frame animation at 400×400 is 32 megapixels in one image. Scale the frames down, or shorten the animation first.
The cut frames are offset by a pixel. What happened?
The grid does not divide the sheet exactly. The tool refuses a grid that would need fractional pixels rather than rounding it, because the error grows with every column; check the numbers, or describe the grid by frame size instead.
Can I get the frames as separate files?
Yes, but from the GIF Splitter: open the animation there and export the frames as PNG files inside a ZIP.