Images to spritesheet and JSON atlas
Create a spritesheet and JSON atlas from an image sequence.
Arrange image frames on one spritesheet
A spritesheet places successive frames into grid cells for use in games and animation frameworks. The column count and cell size control atlas layout.
Your game must know which grid cell represents each animation frame.
Instructions
- 1
Choose the source animation or the sequence of images requested by this page.
- 2
Select frame count, timing, dimensions or other controls when available, then start processing.
- 3
Download the generated output and check the frame order and playback where relevant.
About this tool
Create a spritesheet and JSON atlas from an image sequence.
Large files may be slow to process. Timing and video compatibility depend on the browser.
Practical questions
What does this tool produce?
The tool assembles sampled frames into the requested output. Frame count, size and delay settings determine motion smoothness and file size. A contact sheet or spritesheet arranges captured frames on one or more still images; it does not play automatically. The images source is sampled or decoded into frames for the requested animation output.
What should I check before using the result?
Only the frames actually sampled or supplied are included. Browser decoder support, frame limits and timing approximation can affect the result. Inspect the downloaded file in the intended application. Keep the original when preserving full fidelity, metadata, or editing ability matters.