PNG 纹理图集
将游戏精灵图打包为 PNG 图集，导出精确坐标、透明像素与边缘扩展。
浏览器本地处理输入PNG 精灵图输出图集 PNG / JSON / CSS单个文件最多 5 MiB · 最多 500 个
- 1添加输入
- 2调整设置
- 3获取结果
工具输入和文件在当前浏览器处理，不会上传。
开始之前
为独立精灵图制作一张纹理图。保留原始像素与透明通道，下载图集、坐标映射与数字 CSS 类，供渲染器使用。留白间距保持透明，边缘扩展另行复制外围像素。
如何使用
- 选择独立 PNG 精灵图。
- 设置图集宽度、留白间距与边缘扩展；每张图四周都预留边界。
- 在棋盘格与实际像素预览中检查结果，再一并下载 atlas.png、atlas.json 和 atlas.css。
支持范围与限制
1–500 个 PNG，单个最多 5 MiB、合计 30 MiB；源图合计最多 800 万像素，图集最多 1600 万像素、单边最多 8192 像素。指定宽度必须容纳每张图及两侧边界。
仅支持静态、非交错、8 位 RGB/RGBA PNG；不支持调色板、透明色键、色彩配置/gamma/色度/EXIF 或动画扩展。已知文本、时间与像素密度元数据会丢弃。包括零透明度下 RGB 在内的所有通道均保留；不裁边、不旋转，按输入顺序确定性分行排列，不承诺最优装箱。
操作示例
示例输入
三张独立 PNG 样本：5×5 RGB、5×5 RGBA、7×7 RGBA。
示例参数
{"width":32,"gutter":1,"extrusion":1}示例输出
3 张图形成 32×11 图集，输出 PNG、坐标 JSON 与 CSS；按坐标裁回后所有 RGBA 通道一致。
出现问题时
调小边界或选择更大的图集宽度，移除超额源像素。将不支持的 PNG 变体导出为不含色彩管理的基础 RGB/RGBA，再重新运行。
常见问题
这是拼图或联系表吗？
坐标映射保留各精灵图独立边界，CSS 使用真实像素坐标。边缘与角落扩展可用于边界附近采样。
相同文件名会冲突吗？
每个输入都有独立数字编号与 CSS 类。原始文件名保留在 JSON 映射中，不会插入 CSS 代码。
PNG 为什么被拒绝？
请导出不含色彩管理、调色板、EXIF 或动画扩展的基础非交错 8 位 RGB/RGBA PNG；不要只给 JPEG 改扩展名。CRC 或压缩流损坏也会失败。