Tools · Sprite Sheet Cutter

Sprite sheet cutter: split sprite sheets into single frames

In short

The Grab3D Sprite Sheet Cutter splits a sprite sheet into single PNG frames right in your browser. Cut by grid with columns and rows or a cell size, offset and spacing, or let the auto-detect mode extract irregular sprites from a transparent or solid background. You get a ZIP of PNGs, a JSON file with the frame coordinates and an animated GIF. Nothing is uploaded.

Input
PNG, WebP, GIF, JPEG, BMP
Modes
Grid, auto-detect
Export
PNG ZIP, single PNG, JSON, GIF, WebP
Privacy
Runs on your device, no upload
Price
Free, no account, no watermark

Drop a sprite sheet or try an example

Click a frame to leave it out. Drag to pan, wheel or + and − to zoom, 0 to fit, arrow keys to move.Tap a frame to leave it out. Drag with one finger to pan, pinch to zoom.

Frames

    How to split a sprite sheet into PNG frames

    1. Drop the sprite sheet onto the page, choose a file or paste it with Ctrl+V. The image is read on your device and is never uploaded.
    2. Check the background. The tool finds transparency or the most common border colour by itself. For a solid colour, pick it with the pipette and set the tolerance.
    3. In grid mode, take one of the suggested grids or enter columns and rows or the cell size. Add the offset (margin top and left) and the spacing between cells if the sheet has them.
    4. For sheets without a grid, switch to auto-detect. Every separate sprite gets its own box. Raise the merge distance if a sprite falls apart, raise the minimum size to ignore specks.
    5. Click frames in the sheet or in the list to leave them out, check the animation preview and set trimming, padding and scale.
    6. Download a ZIP with all PNG frames and the JSON, single PNGs, or the animation as GIF or WebP.

    What is a sprite sheet?

    A sprite sheet is one image that holds many smaller images, for example all frames of a walk cycle, the directions of a character or a set of items. Games load one texture instead of dozens of files, which is faster and keeps related art together.

    Many tools and engines want the frames as separate files though: an animation editor that takes single images, a level editor that lists items one by one or a sprite you want to edit and repack. A sprite sheet splitter cuts the sheet back into those single frames, and that is what this sprite sheet cutter does without a desktop program.

    Grid or auto-detect: which mode fits your sheet

    Grid mode

    For sheets where every frame sits in a cell of the same size, the usual layout for animations and tilesets. Enter columns × rows or the cell size in pixels. The tool proposes grids from gaps between sprites, drawn separator lines and the divisors of the image size, and empty cells are skipped automatically.

    Auto-detect (sprite extractor)

    For sheets without a grid: packed atlases, item collections or ripped sheets on a solid colour. Every connected group of pixels becomes one sprite, parts that are close together are merged and tiny specks are ignored. The frames are numbered row by row from the top left.

    Offset and spacing explained

    The offset is the empty border before the first cell, on the left and at the top. The spacing is the gap between two cells, horizontally and vertically. Both are common in tilesets and in sheets exported by packers, often 1 or 2 pixels so that colours do not bleed between frames.

    If the cuts slowly drift away from the sprites from left to right, the spacing is missing or wrong. If every frame shows a strip of its neighbour on the same side, the offset is off. The tool tints offset and spacing in the preview and shows how many pixels are left over at the right and bottom edge. In columns × rows mode the same margin is assumed on the right and at the bottom, with a cell size you set only the left and top margin count.

    Cell Offset Spacing
    Offset Cell Spacing

    Using the frames in your engine

    The PNG frames work in every engine. The JSON describes the frames on the original sheet in the TexturePacker JSON Hash layout, so you can also keep the sheet as one texture.

    Godot 4

    Create an AnimatedSprite2D, open its SpriteFrames and drag the numbered PNGs into an animation. They are added in name order. For pixel art set the texture filter to Nearest in the project settings under Rendering, Textures.

    Unity

    Import the PNGs with Texture Type Sprite (2D and UI). Select all frames and drag them into the scene, Unity creates an animation clip from them. For pixel art use Filter Mode Point and Compression None.

    Phaser

    Load the original sheet with the JSON as an atlas: this.load.atlas(key, "sheet.png", "sheet.json"). The frame names are the PNG names, so generateFrameNames with prefix, zeroPad and the suffix .png builds the animation.

    GameMaker

    Add the PNG frames as sub images of one sprite in the Sprite Editor, they keep the order of the numbers. For a strip that is already clean, Import Strip Image in the Image menu works with the same frame size, offset and separation values.

    Typical problems and quick fixes

    The animation jumps or wobbles
    Trimming each frame on its own moves the sprite. Use "Trim to shared box" in grid mode, it cuts every frame to the same rectangle relative to its cell. In auto-detect mode use "Same size" with the bottom centre anchor for characters.
    Edges of the neighbour frame show up
    The cell size, offset or spacing does not match the sheet. Pick a suggestion or compare the tinted spacing in the preview with the gaps in the image. In auto-detect mode keep "Hide parts of neighbouring sprites" on.
    A coloured fringe stays after removing the background
    The edge pixels were blended with the background colour when the sheet was made. Raise the tolerance a little. A perfectly clean edge is only possible from a source with real transparency.
    One sprite is split into several frames
    Parts that do not touch, like a sword or a shadow, are separate pixel groups. Raise the merge distance until they belong together.
    The last column or row is missing
    The grid does not fit the image size. The info line under the grid settings shows the unused pixels on the right and at the bottom. Check the cell size or switch between columns × rows and cell size.
    Pixel art looks blurry
    The tool never smooths pixels, scaling uses nearest neighbour at 2× or 4×. If frames look soft in the game, switch the texture filter of the engine to nearest or point.

    Related tools and free sprites

    Frequently asked questions

    Is the Sprite Sheet Cutter free, and are my images uploaded?

    It is free with no account, no limit and no watermark. The image is decoded and cut in your browser. No file is sent to a server, so it also works with unreleased art.

    How do I split a sprite sheet into individual PNG files?

    Open the sheet, check the background, accept a suggested grid or enter columns and rows, then click Download ZIP. The ZIP holds one PNG per frame, named by your pattern, plus a JSON with the coordinates.

    What is the difference between a sprite sheet cutter and a sprite extractor?

    A cutter or splitter cuts along a regular grid. An extractor finds sprites that are placed freely. This tool does both: grid mode for regular sheets and auto-detect for irregular ones.

    What do offset and spacing mean?

    The offset is the margin before the first cell on the left and at the top. The spacing is the gap between neighbouring cells. Both are set separately for X and Y.

    How do I remove a solid background colour?

    Choose Colour as background, pick the colour with the pipette and keep "Make background transparent" on. The tolerance decides how far a pixel may differ from the colour and still count as background.

    Can I keep all frames the same size?

    Yes. "Trim to shared box" cuts every cell to the same rectangle and keeps the animation in place. "Trim, same size" centres or bottom aligns each trimmed frame on one common size. Padding adds empty pixels on all sides.

    Which files can I export?

    A ZIP with PNG frames and an optional JSON, single PNGs from the frame list, the JSON alone, and the selected frames as an animated GIF or WebP. WebP export needs a browser that can encode WebP.

    How large can a sprite sheet be?

    Images up to 16384 pixels per side and 134 megapixels in total are accepted. The sheet is analysed in strips to save memory, so 8192 × 8192 works in a desktop browser. Phones with little memory may refuse very large images.

    Can I make a sprite sheet from a 3D model?

    Yes, with the Sprite Sheet Generator. It renders a model or a rigged walk and run cycle from several directions into one sheet with JSON for engines.

    All free tools