Sprite Sheet Generator
Combine frames into a single sprite and export CSS/JSON frame definitions.
Overview
Generate a sprite sheet for web/games in the browser, and export the sprite map with frame coordinates as JSON/CSS.
How to use
- Drop same-sized frame images.
- Configure rows/cols, padding, and ordering (row/column-major).
- Select output format (PNG/WebP) and compression, then save with CSS/JSON.
- (वैकल्पिक) फ़्रेम नामों के लिए प्रीफिक्स और क्रम नियम सेट करें।
उपयोग के मामले
- CSS एनीमेशन हेतु आइकन स्प्राइट।
- 2D गेम वॉक/अटैक जैसी सीक्वेंस को एक इमेज में जोड़ना।
- Lottie/APNG के हल्के लूप विकल्प।
Tips & knowledge
- Sprites reduce HTTP requests and help performance.
- Trim transparent margins to reduce size.
- Control animation timing with CSS steps() or JS timers.