Flexible Grid to Animated GIF Maker

GIF Grid Maker

Upload a JPEG or PNG containing multiple animation frames in a grid. Choose the grid rows and columns, adjust each frame position manually, then export an animated GIF.

1. Grid settings & upload

Set the number of columns and rows before uploading. Example: 3 columns × 3 rows = 9 frames.

2. Preview & export

Preview the animation, click any frame, then adjust its position and scale.

Animation preview
No frames yet

Frame 0 / 0

Extracted frames 0 frame(s)
3. Manual frame adjustment No frame selected
No frame selected
X position 0 px
Y position 0 px
Scale 100%

Tip: If the main character jumps around, click each frame and use X/Y/Scale to align the character. These adjustments will be used in the final exported GIF.

Speed: 8 FPS
GIF quality: 10
Lower number = better quality

Final GIF preview

Generated GIF preview
Frame order: left to right, top to bottom. Example for 3×3: 1 → 2 → 3 → 4 → 5 → 6 → 7 → 8 → 9.
Output size: each frame is automatically limited to the selected maximum size. Default is 512×512 px.
Guide overlay: a grey dotted 5×5 alignment guide is shown on the animation preview and edit preview to help align the subject.
Mobile support: the layout automatically changes to a single-column touch-friendly interface on smaller screens.
Transparent GIF: transparent PNG backgrounds are preserved during GIF export. GIF only supports one transparent color, so soft semi-transparent edges may become harder than PNG.
Key frame overlay: choose one key frame as the bottom layer, show the current frame on top, and adjust the top opacity to align the subject more accurately.
Required files: this page expects gif.js and gif.worker.js in the same folder as index.html.
Built-in tests: