Add an image

Drop in PNG, JPG, WebP, or GIF files, a whole sprite sheet to split, or a ZIP of frames. Add as many as you like, arrange them, and pack them into one sheet.

Recent sprites

Free sprite sheet maker: combine images into one sheet

Combine a batch of loose images into one sprite sheet. Drop in as many frames as you like, in any of PNG, JPG, WebP, or GIF, and they land on a timeline in the order they arrived. The layout is yours. A grid, a horizontal strip, or a vertical strip, with padding, integer scale, and a transparent or solid background. Reorder frames by dragging, hide any you want left out, and hit play to watch the animation before you pack it. Export a sheet PNG on its own, or the sheet with a JSON atlas beside it for Phaser, Pixi, and TexturePacker. Everything runs in your browser. Nothing is uploaded, there is no account, and there is no watermark on what you export. Going the other way, from a finished sheet back to frames, is the sprite sheet cutter.

How to make a sprite sheet

Making a sprite sheet takes five steps, and the preview is the sheet itself the whole way through.

  1. Drop in your frames, as many at once as you like
  2. Put them in order on the timeline. Drag to rearrange, hide the ones you want left out, and press play to check the motion
  3. Pick a grid, horizontal strip, or vertical strip, then set columns, padding, scale, and the background
  4. Watch the preview, which is the sheet itself, so what you see is what downloads
  5. Download the sheet as a PNG, or the sheet with a JSON atlas beside it in a ZIP

Here's a real one. Eight frames of a katana girl idle animation, dropped in as loose 64x64 PNGs and packed into a horizontal strip, the classic animation sheet layout.

An 8-frame katana girl idle animation packed into a horizontal sprite sheet by the tool
An 8-frame katana girl idle animation packed into a horizontal sprite sheet by the tool

What is a texture atlas

A texture atlas is one image holding many smaller graphics plus a data file that records where each one sits. Engines love them because loading one texture and addressing sub-rectangles is far cheaper than loading forty files. A sprite sheet is the game-art flavor of the same idea, and the JSON atlas this tool exports is the coordinate file half. It uses the JSON hash format Phaser, Pixi, and TexturePacker read, so your engine can ask for a frame by name instead of you hardcoding pixel rectangles.

Atlases aren't only for animation. Here are eight item sprites packed into one 256x128 texture, the shape of every crafting menu and inventory screen you've ever seen. The engine loads this once and pulls the cauldron from its rectangle when the shop needs it.

Eight game item sprites, an anvil, a cauldron, a sword, ore, an egg, a trophy, an orb, and cheese, packed into one 4x2 texture atlas by the tool
Eight game item sprites, an anvil, a cauldron, a sword, ore, an egg, a trophy, an orb, and cheese, packed into one 4x2 texture atlas by the tool

What the sprite sheet maker does

The maker side packs. The tool also imports, splits, and previews.

  • Combines a batch of PNG, JPG, and WebP images into a single sheet, in the order you set
  • Takes a ZIP full of loose frames, so a folder of art becomes a sheet in one drop
  • Animated GIFs and your saved Sprite-AI animations arrive as separate frames, already in order
  • Timeline with drag reorder, delete, and a hide toggle that keeps a frame out of the sheet without losing it
  • Playback preview, so you can watch the animation run before committing to a layout
  • Grid, horizontal strip, or vertical strip, plus padding, integer scale, and background controls
  • Frames of different sizes are fine. Each one is centered in a cell sized to your largest image
  • Exports a sheet PNG, or a PNG and JSON atlas together as a ZIP
  • Runs entirely in your browser. Nothing uploads, no account, no watermark

What sprite sheets are used for

Almost every 2D engine wants animated sprites delivered as one packed image, and that shapes every job on this list.

  • Packing a hand drawn walk cycle into one sheet for Unity, Godot, Phaser, or GameMaker
  • Turning a folder of AI generated sprites into a single texture the engine loads once. Generate them with the AI sprite generator on Sprite AI (sprite-ai.art) and this page is the second half of that sprite sheet generator workflow
  • Combining UI icons into one atlas so a game fetches one file instead of forty
  • Rebuilding sprite sheets after editing the frames somewhere else
  • Laying an animation out as a horizontal strip, which is what most engines import most easily
  • Adding padding between cells to stop neighbouring frames bleeding in at non-integer zoom

FAQ

Drop your images onto the upload area, or click it and select several at once. They land on the timeline in the order they arrived, and you can drag them around from there. Choose a grid, horizontal strip, or vertical strip, set the columns, padding, and scale, then download. You get one packed PNG back, and the preview shows exactly what it will look like the whole way through.

Yes, and the [sprite sheet cutter](/tools/sprite-sheet-cutter) is the page set up for it. Drop a finished sheet in, the grid gets detected for you, and every frame comes back out as its own PNG in a ZIP. Dropping a lone sheet here reaches the same cutting step, so you do not lose anything by starting on this page.

PNG, JPG, WebP, and GIF for images. Animated GIFs are broken into their individual frames automatically, so one GIF can fill a whole sheet on its own. You can also drop a ZIP containing a sheet and its atlas, or one holding a pile of loose frames, and a .json atlas on its own will attach itself to the sheet it belongs with.

No. The cell size comes from your largest frame, and every smaller one is centered inside that cell with transparent space around it. The grid stays even and the atlas rectangles stay accurate, which is what matters to the engine reading it. If you pull the frames back out as a ZIP you get the originals, not the padded versions.

Yes. The timeline along the bottom is the same one from the Pixel editor. Drag a frame to move it, delete the ones you do not want, or use the eye toggle to hide a frame so it stays available but is left out of the sheet. Press play at any point to watch the animation and confirm the order reads correctly before you export.

It records the pixel rectangle and duration of every frame in the JSON hash format that Phaser, Pixi, and TexturePacker read, and that Godot and Unity can take through a plugin. Choose the ZIP download to get the sheet PNG and the JSON together, so your engine can address frames by name instead of you hardcoding coordinates.

Yes. A plain sheet PNG with even cells and no padding is what Unity's sprite editor and Godot's AtlasTexture expect, and that is the default here. For Phaser and Pixi, take the PNG plus JSON atlas option and load the pair directly. Padding is there for the engines and shaders that bleed edges between cells.

Yes, free with no account and no watermark. The packing and the slicing both happen in your browser on your own machine, so your images never leave your computer and there is no upload to wait on.

Up to 256 frames, each up to 4096 by 4096 pixels and 25MB per file. That comfortably covers a full character animation set, a tileset, or an icon batch. If you go past the limit the extras are turned away with a notice rather than silently dropped, so you always know what made it in.

We use cookies to enhance your experience. Essential cookies are required for the site to function. You can choose to accept all cookies or only essential ones.

Cookie policy