How to use Image sheet and sprite generator
- Add the small images you want to combine.
- Choose the layout and spacing.
- Generate the sheet.
- Download the combined image together with the CSS and JSON files.
Why use this tool
A sprite sheet packs many small images into one picture. Websites use it to cut down the number of requests, and game developers use it as a texture atlas. You also get the CSS and a JSON file that say exactly where each image sits, so using the sheet is straightforward.
Tips for best results
- Keep your icons the same size for a tidy, predictable sheet.
- Add a little spacing to stop neighbouring images bleeding into each other.
- Use clear, short file names. They are used to label the entries in the CSS and JSON.
Frequently asked questions
Why use a sprite sheet?
One file loads faster than dozens of tiny ones, which helps both websites and games.
What is the JSON for?
It lists the position and size of each image, so game engines and scripts can find them.
Is it private?
Yes. All packing happens in your browser.