Image Sprite Generator
Combine images into a PNG sprite sheet with CSS and JSON coordinates. Set columns and spacing, preview and download the files locally.
Loading your local workspace…
Your files are processed locally. The original file is kept unchanged. Choose your settings, create the result, and use the download button to save it.
About Image Sprite Sheet Generator
Pack multiple small images into one sheet for a website or application. Choose the number of columns and the gap between images; the output includes the PNG and companion coordinates so individual sprites can be positioned correctly.
How to use this tool
01 · Prepare your input
Choose your images from the device. Keep the batch within 50 files and 40 million pixels in total.
02 · Set columns and spacing
Choose how many images fit across the sprite sheet and the gap between them.
03 · Review the result
Generate the PNG sheet and download the companion CSS and JSON coordinate files.
Before you download.
What to know about Image Sprite Sheet Generator.
How do I locate individual images in the sheet?
Use the generated CSS or JSON coordinates. Keep the sheet dimensions unchanged, or update the coordinates if you later resize the sheet.
Are my files uploaded for processing?
No. File contents are processed in your browser. The site, codecs and any required models still need to load over the network; local results depend on your device and browser.