Sprite Sheet Generator
Pack several images into one sprite sheet and get the matching CSS.
Fill in the form and press “Build sprite sheet” to see the result here.
How to use it
- 1Select your image, or drag and drop it onto the upload area.
- 2Adjust the options if you need something other than the defaults.
- 3Press the button. The image is processed on your device - nothing is uploaded.
- 4Download the result, or drop in another file to do it again.
About the Sprite Sheet Generator
Images are packed into a uniform grid sized to the largest of them, which keeps every sprite position predictable arithmetic rather than a lookup table.
The generated CSS gives each sprite a class with the right dimensions and background position, ready to paste into a stylesheet.
Sprite sheets mattered most before HTTP/2 made many small requests cheap. They are still the right answer for canvas games and for icon sets that must load as a single asset.
Questions people ask
Is your image uploaded to a server?
No. This tool runs entirely in your browser using standard web APIs, so your image never leaves your device. You can confirm it by opening your browser's network panel while the tool runs, or by disconnecting from the internet after the page has loaded.
Is it free, and do I need an account?
Yes, it is free, and there is no account, no sign-up and no watermark on the result. The project is funded by optional donations.