🔍

首页Home › 图片工具Image Tools

🎞️ 动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)Convert Animation to Bitmap Sprites

把 GIF、WebP 或 APNG 动画的每一帧取出来,按网格、横排或竖排拼成一张精灵图(Sprite Sheet),保存为 24 位 BMP 位图或 PNG。可设置列数、帧间距、每隔几帧取一帧、最多帧数和背景色(PNG 可保留透明),另外可下载每一帧单独的图片(ZIP)和记录每帧位置与时长的 JSON 坐标文件,方便游戏引擎、CSS 动画和单片机屏幕使用。全部在浏览器本地完成。Pull every frame out of a GIF, WebP or APNG animation and lay them out in a grid, a row or a column as one sprite sheet, saved as a 24-bit BMP bitmap or PNG. Set the number of columns, spacing between frames, take every Nth frame, a maximum frame count and the background colour (PNG can keep transparency). You can also download each frame as its own image (ZIP) and a JSON file with every frame's position and duration for game engines, CSS animation or microcontroller displays. Everything runs in your browser.

点击选择或拖放 GIF / WebP / APNG 动画Click or drop a GIF, WebP or APNG animation here

使用说明与常见问题How-to & FAQ

「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」是什么?What is the Convert Animation to Bitmap Sprites tool?

把 GIF、WebP 或 APNG 动画的每一帧取出来,按网格、横排或竖排拼成一张精灵图(Sprite Sheet),保存为 24 位 BMP 位图或 PNG。可设置列数、帧间距、每隔几帧取一帧、最多帧数和背景色(PNG 可保留透明),另外可下载每一帧单独的图片(ZIP)和记录每帧位置与时长的 JSON 坐标文件,方便游戏引擎、CSS 动画和单片机屏幕使用。全部在浏览器本地完成。Pull every frame out of a GIF, WebP or APNG animation and lay them out in a grid, a row or a column as one sprite sheet, saved as a 24-bit BMP bitmap or PNG. Set the number of columns, spacing between frames, take every Nth frame, a maximum frame count and the background colour (PNG can keep transparency). You can also download each frame as its own image (ZIP) and a JSON file with every frame's position and duration for game engines, CSS animation or microcontroller displays. Everything runs in your browser.

如何使用「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」?How do I use the Convert Animation to Bitmap Sprites tool?

在「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」中,选择或拖入文件,按需设置「排列」、「列数(空=自动)」、「帧间距(像素)」、「每隔几帧取一帧」、「最多帧数」等选项,然后点击「下载精灵图」、「下载所有帧(ZIP)」、「下载 JSON 坐标」按钮即可。In the Convert Animation to Bitmap Sprites: Choose or drop your files, set "Layout", "Columns (blank = auto)", "Spacing (px)", "Take every Nth frame", "Max frames", then click "Download sprite sheet", "Download all frames (ZIP)", "Download JSON coordinates".

精灵图是怎么排列的?How is the sprite sheet laid out?

帧按播放顺序从左到右、从上到下排列。网格模式下列数留空时自动取接近正方形的列数(例如 20 帧排成 5 列 × 4 行),也可以自己填写;“横排一行”和“竖排一列”适合 CSS steps() 动画。帧间距会加在相邻帧之间(四周不留边),每一帧的准确位置可以下载 JSON 坐标文件查看。Frames go left to right, then top to bottom, in playback order. In Grid mode a blank Columns picks a near-square layout (20 frames become 5 columns × 4 rows), or type your own; One row and One column suit CSS steps() animations. Spacing is added between neighbouring frames (not around the edge), and the exact position of every frame is in the JSON coordinates file.

为什么 BMP 精灵图没有透明背景?Why does the BMP sprite sheet have no transparency?

这里生成的是兼容性最好的 24 位 BMP,它没有透明通道,透明的地方会填上所选的背景色(默认白色)。需要保留透明时请选择 PNG 并勾选“透明背景”。The tool writes a 24-bit BMP for maximum compatibility, and that format has no alpha channel, so transparent areas are filled with the chosen background colour (white by default). To keep transparency, choose PNG and tick Transparent background.

支持哪些动画?帧数很多怎么办?Which animations are supported? What about animations with many frames?

GIF 在所有浏览器里都能拆帧(每一帧都按 GIF 的处置方式合成为完整画面);WebP 和 APNG 动画需要支持 ImageDecoder 的浏览器(如最新版 Chrome、Edge)。精灵图每边最多 16384 像素,帧数多时可以用“每隔几帧取一帧”或“最多帧数”减少帧数。所有处理都在本地完成,不会上传。GIF frames can be extracted in every browser (each frame is composited into a full picture following the GIF disposal rules); WebP and APNG animations need a browser with ImageDecoder, such as a recent Chrome or Edge. A sprite sheet can be at most 16384 pixels per side, so for long animations use Take every Nth frame or Max frames. Everything is processed locally and nothing is uploaded.

图片会被上传到服务器吗?Are my images uploaded?

不会。「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」使用浏览器 Canvas 在本地处理图片,处理后的文件直接从你的浏览器下载。No. The Convert Animation to Bitmap Sprites processes images locally with the browser Canvas API and the result downloads straight from your browser.

「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」免费吗?需要注册吗?Is the Convert Animation to Bitmap Sprites free? Do I need an account?

「动画转位图精灵图(GIF 拆帧拼成 Sprite Sheet)」完全免费,无需注册或安装,打开网页即可使用,手机和电脑都能用;输入的内容只在你的浏览器本地处理。The Convert Animation to Bitmap Sprites is completely free with no sign-up or install and works on phones and desktops; what you enter is processed only in your browser.

相关工具Related tools

🔢 位图转十六进制(BMP 像素 HEX 颜色 / C 数组)Convert Bitmap to Hex🔄 RGB 位图转 BGR(交换红蓝通道)Convert RGB Bitmap to BGR Bitmap✂️ 位图裁剪(按像素或百分比裁剪 BMP)Crop a Bitmap↔️ 位图水平翻转(左右镜像 BMP)Flip a Bitmap Horizontally↕️ 位图垂直翻转(上下颠倒 BMP)Flip a Bitmap Vertically🌗 位图反色(BMP 负片效果)Invert Bitmap Colours🎚️ 位图减色(减少 BMP 颜色数 / 索引色)Reduce Bitmap Colours🔲 去除位图边框(自动裁掉 BMP 四周的纯色边)Remove a Bitmap Border📐 位图缩放(调整 BMP 尺寸)Resize a Bitmap🔃 位图旋转(BMP 旋转 90° / 180° / 任意角度)Rotate a Bitmap🧪 位图分色(拆分 BMP 的红、绿、蓝通道)Separate Bitmap Colours✨ 位图锐化(BMP 反锐化掩模 / 拉普拉斯)Sharpen a Bitmap

← 全部工具All tools