制作 PNG 精灵图与 JSON 坐标表

把两至六十四张受支持的栅格图片排列到固定单元格,并在 ZIP 中下载一张 PNG 和一份以左上角为原点的 JSON 坐标表。

适用场景

适合把小型游戏精灵、图标、缩略图或界面状态打包成一张可预测位图,并提供机器可读的单元格坐标。

本地处理原理

输入保持选择顺序,列数受实际输入数量限制,每帧获得固定单元格;完整显示会居中保留整图,填满会铺满后裁切,间距使用所选 RGBA 背景,ZIP 包含 sprite-sheet.png 与确定性的 sprite-sheet.json 坐标。

使用方法

  1. 准备安全的工作副本: 保持所有源文件不变,处理前查看受支持的输入、控件和限制。 适合把小型游戏精灵、图标、缩略图或界面状态打包成一张可预测位图,并提供机器可读的单元格坐标。
  2. 在本地处理: 仅在当前浏览器中执行已说明的操作;报告不支持结构时应停止。 输入保持选择顺序,列数受实际输入数量限制,每帧获得固定单元格;完整显示会居中保留整图,填满会铺满后裁切,间距使用所选 RGBA 背景,ZIP 包含 sprite-sheet.png 与确定性的 sprite-sheet.json 坐标。
  3. 下载并验证: 解压两个文件,对照 JSON 确认 PNG 尺寸、左上角原点、帧顺序和单元格矩形,检查完整显示的留白或填满造成的裁切,并在使用方应用中加载坐标表。

重要限制

PNG 是一张扁平栅格图:不会保留动画、矢量、图层、源元数据、独立容器或色彩配置意图。填满可能裁边,完整显示可能留背景,并受源文件、总像素、画布、内存、PNG、JSON 和 ZIP 限制。

验证下载结果

解压两个文件,对照 JSON 确认 PNG 尺寸、左上角原点、帧顺序和单元格矩形,检查完整显示的留白或填满造成的裁切,并在使用方应用中加载坐标表。

隐私优先

文件只在当前浏览器中处理,源文件和结果不会上传到我们的服务器。

常见问题

什么时候适合使用此工具?

适合把小型游戏精灵、图标、缩略图或界面状态打包成一张可预测位图,并提供机器可读的单元格坐标。

浏览器实际执行什么操作?

输入保持选择顺序,列数受实际输入数量限制,每帧获得固定单元格;完整显示会居中保留整图,填满会铺满后裁切,间距使用所选 RGBA 背景,ZIP 包含 sprite-sheet.png 与确定性的 sprite-sheet.json 坐标。

使用前必须了解哪些限制?

PNG 是一张扁平栅格图:不会保留动画、矢量、图层、源元数据、独立容器或色彩配置意图。填满可能裁边,完整显示可能留背景,并受源文件、总像素、画布、内存、PNG、JSON 和 ZIP 限制。

下载后应怎样验证结果?

解压两个文件,对照 JSON 确认 PNG 尺寸、左上角原点、帧顺序和单元格矩形,检查完整显示的留白或填满造成的裁切,并在使用方应用中加载坐标表。

相关工具