Sprite Sheet Cutter Guide
Upload a sprite sheet and the tool finds every object in it and exports each one as a PNG with a transparent background. The default settings work for most images; the second half of this guide explains what to change when they don't.
1. What is a sprite sheet?
A sprite sheet (also called an atlas) puts many small images — animation frames, icons, items, effects — into one large image. It is common in game development, the web, and UI design.
Cutting the objects out by hand is slow and tends to leave extra empty space, especially when objects differ in size or are not laid out on a grid. This tool detects the outline of each object and crops along it.
2. Split it in three steps
Upload an image
Open the home page and click the upload area to choose an image, or drop the image onto it. PNG, JPG and WebP are supported, up to 4000×4000 pixels and 4 MB.
Automatic detection
Detection starts as soon as the upload finishes; there is nothing else to click. Each object is then outlined with a box, and “N objects found” is shown above the image.
Download
Click “Download cut-outs (ZIP)”. The ZIP contains one transparent PNG per object, named by number (001.png, 002.png, …) to match the numbers on the preview. Cutting and zipping happen in your browser.
To process another image, click or drop a new one. Uploaded images are deleted automatically about 24 hours after upload; see the Privacy Policy.
3. Reading the result
- N objects found: compare it with the number of objects you can see. Too many usually means objects were split or noise was picked up; too few usually means some objects were merged.
- Show numbers: shows a number next to each box, matching the file names in the ZIP.
- Rotated boxes: shows each object with a box rotated to fit it, which helps check tilted objects. It only affects the preview, not the exported images.
4. Advanced settings
If the result is off, open “Advanced settings (only if the result is off)” below the upload area. Every change is applied automatically; “Reset to defaults” restores the initial settings, and “Detect again” runs detection again with the current settings. Your settings are remembered in this browser for next time.
| Setting | Default | Range | What it does |
|---|---|---|---|
| Close gaps | 0 | 0 – 24 | Joins broken edges. More makes pieces join into one object, but also makes neighbouring objects more likely to stick together. |
| Expand | 0 | 0 – 24 | Grows each object outward. Merges pieces that are close to each other; boxes get larger too. |
| Edge threshold (low) | 50 | 0 – 255 | Lower picks up fainter, low-contrast edges. |
| Edge threshold (high) | 230 | 0 – 255 | Higher keeps only strong edges; raise it when the background has texture or a gradient. |
| Smoothing | 0.1 | 0.1 – 3 | Smooths the image before detection. Higher ignores noise and fine texture, but very small objects may be ignored too. |
| Join distance (horizontal / vertical) | 1 / 1 | 1 – 12 | Width and height that “Close gaps” and “Expand” act on each time. Raise the horizontal one for horizontal gaps, the vertical one for vertical gaps. |
Change one setting at a time, in small steps, and watch how the object count and the boxes change. For the edge detection behind these settings, see Canny Edge Detection Explained.
5. When the result is off
One object is split into several pieces
Increase “Close gaps”, then “Expand” if that is not enough; for wider gaps, also increase “Join distance”. Lowering “Edge threshold (low)” helps faint edges connect.
Several objects are detected as one
Lower “Close gaps”, “Expand” and “Join distance”; if they still stick together, raise “Edge threshold (high)”. If the objects actually touch, add some space between them in an image editor before uploading.
Many tiny extra boxes appear
Raise “Smoothing” or “Edge threshold (low)” so that noise and fine texture are no longer taken as edges.
The whole image is detected as one big box
Usually the background has texture or a gradient. Raise “Edge threshold (high)”; for a very busy background, replace it with a solid colour or transparency before uploading.
An object is not detected at all
Its colour is too close to the background. Lower “Edge threshold (low)” and set “Smoothing” back to a small value; if that does not help, increase the image's contrast or change the background colour first.
6. Which images work best
- A clean background: white, black, or transparent backgrounds are the easiest to detect.
- Space between objects: leave at least a few pixels, or neighbouring objects may be detected as one.
- PNG where possible: JPG compression adds noise around edges that can affect detection, and PNG keeps transparency. See the image format comparison.
- Shrink or crop large images first: images over 4000×4000 pixels or 4 MB cannot be uploaded.