Sprite Sheet Maker and Animation Previewer

Build a sprite sheet and preview the animation

Combine individual image frames into one PNG sheet for a game character, pixel-art animation, interface effect or creative prototype. The free sprite sheet maker packs frames into a configurable grid and lets you preview playback before downloading. Export a matching JSON map so you can locate each frame in your own project, or save a looping animated GIF to share the animation directly.

How to create a sprite sheet

1. Try the built-in fox sample, or choose your own image frames. Your first upload replaces the sample; later uploads append to your frames.
2. Use the arrows below a frame to change its position, drag it into place, or remove frames you do not need.
3. Set the cell width, cell height, number of columns and padding.
4. Choose whether to fit each image inside its cell or fill the cell by cropping. Keep sharp pixel edges enabled for pixel art.
5. Adjust playback speed, then download a PNG sheet, JSON map or animated GIF.

What the JSON frame map contains

The map lists each frame’s filename and its rectangular cell coordinates in pixels. It also records original source dimensions, sheet dimensions, columns, padding, fitting mode and playback speed. Frames are listed in the same order as the preview. The metadata references sprite-sheet.png, so keep that filename or update the reference if you rename the image.

This is a straightforward JSON format for your own code or an import adapter. Game engines have different atlas schemas, so check the format your engine expects before importing. The output is a uniformly sized grid rather than a tightly trimmed texture atlas.

Transparency and image quality

Enable Transparent background to preserve empty space around your artwork. Use PNG source frames when you need transparency. The sharp-edge option disables image smoothing when frames are resized, which suits pixel art. Turn it off for smoother scaling of photographic or painted frames. Animated GIF uploads are treated as a single still frame rather than split into their animation sequence.

Frequently asked questions

How many frames can I use?

Up to 64 frames, with up to 20 MB per source file and 32 million source pixels combined. Output sheets are limited to 16 million pixels and 8192 pixels per side to keep browser memory use manageable.

Does the tool upload my assets?

No. Frames, sheet generation and animation previews stay in your browser.

Can I reorder frames without dragging?

Yes. Every frame has earlier and later buttons that work with a keyboard or touch screen.

Can I download the animation as a GIF?

Yes. Choose Download animated GIF to export a looping animation in the current frame order and at the selected playback speed. It uses the current fitting, pixel-edge and background settings. GIF export frames are limited to 1024 pixels per side and may be resized further for large frame sets. GIF supports fully transparent pixels, but not partial transparency; larger color palettes are reduced for export. PNG sheets preserve full image color and alpha transparency.

Create more frame artwork with the pixel art maker, or build repeating scenery with the seamless pattern maker.