帧工坊 FrameCraft 帧工坊 FrameCraft

合图拆分:一张 Sprite Sheet 自动切成序列帧

手上有一整张动作序列大图,要拆成一帧一帧用?把图拖进来,工具会自己判断这张合图是几行几列、格子边界落在哪,不用你一格一格数;切完按动画播放顺序(从左到右、从上到下)排好,可以直接导出 PNG 序列、重新拼成别的排布,或者生成一张 GIF 看动作对不对。图片只在你的浏览器里处理,不上传服务器——没公开的游戏素材不用担心外泄。

支持 PNG / JPG / WebP 透明图 · 空白格自动跳过 · 识别没把握时会明说,让你手填

1
上传合图
🖼️

把合图拖进来,或点这里选一张

PNG / JPG / WebP 都支持,透明通道会保留

单张处理,不上传服务器
2
确认格子
还没上传图片
上传后点「自动识别格子」
列 行
3
切出来的帧(按动画顺序排列)
第 1 / 0 帧 速度
4
导出
PNG 序列 ZIP 重新拼合图 GIF 动图 单张 PNG

怎么用

  1. 上传合图:把一整张序列帧大图拖进第一步的框里。
  2. 自动识别:点「✨ 自动识别格子」,工具会告诉你这张图是几行几列、每格多大,原图上会画出切分线给你核对。
  3. 切分并排序:点「✂ 按这个网格切分」,切出来的帧按从左到右、从上到下排好,就是动画播放顺序;不要的帧点一下就能删。
  4. 导出:PNG 序列打包成 ZIP,或者重新拼成别的列数排布,也可以直接生成 GIF 看动作。

常见问题

自动识别是怎么判断几行几列的?

先判定背景是什么(有透明通道就用透明,否则取四条边最常见的颜色),再统计每一列、每一行的内容密度,然后给每种可能的行列数打分:格子边界应该落在空白处、每个格子的内容量要相近、首尾格必须有内容。分数不够高时它会直接告诉你「没看出格子」,让你手填,不会硬切。

为什么我这张图识别不出来?

最常见的原因是格子紧贴、内容铺满整幅(导出时间距设了 0 的那种)——这种情况下每一列的密度几乎一样,没有任何周期信号可循,工具宁可认不出来也不乱切。遇到这种请手填行列数。

识别出的行列数不对怎么办?

直接在「列 / 行」输入框里改,再点「✂ 按这个网格切分」就行。自动识别只是帮你省去数格子的功夫,它给出的结果随时可以覆盖。

切出来的顺序对吗?

按「从左到右、从上到下」排列,这正是绝大多数 Sprite Sheet 的动画播放顺序。如果你的素材是别的排布,可以在切完后用删除功能去掉多余帧,或导成 PNG 序列后自行重命名排序。

透明背景会保留吗?

会。PNG 序列按原样切出,透明通道完整保留;导出 GIF 时因为格式限制,半透明像素会被转成全透明或全不透明。

素材安全吗?收费吗?

安全,所有处理在浏览器本地完成,图片不经过任何服务器。免费,无水印、无需注册。

相关工具