Sprite Sheet Maker
Pack animation frames or icons into one sprite sheet with CSS and JSON.
How it works
- 1Add frames (sorted by file name).
- 2Set the columns and padding.
- 3Download the PNG, CSS and JSON.
Features
- Up to 200 frames.
- Reorder and remove frames.
- CSS classes and JSON frame data.
- Private: runs in your browser; nothing is uploaded.
Frequently asked questions
Can I make a GIF instead?
Yes, use GIF Maker.
Do frames need the same size?
No; each sits in a cell the size of the largest frame.
Related tools
GIF MakerMake an animated GIF from photos or screenshots.Image SplitterCut an image into a grid of equal pieces at full resolution.Image to Base64Convert an image to a Base64 data URL with HTML, CSS and Markdown snippets.GIF CompressorBetaMake an animated GIF smaller by reducing colors, frame rate and size.