企鵝走路
6 個影格排成一行，都站在同一條地面線上。
精靈圖製作：多張圖片合成一張精靈圖
放入 PNG 影格、圖示或遊戲道具，幾秒鐘就能得到一張精靈圖（sprite sheet）：整齊的網格或緊密排列，附帶 JSON 或 XML 圖集、CSS 精靈圖和 GIF 動圖。這款免費的精靈圖製作工具在你的瀏覽器裡執行，檔案不會上傳。
精靈圖製作免費 · 在瀏覽器裡執行
把圖片拖到這裡
PNG、WebP、JPG、GIF 或 AVIF，需要幾張就放幾張。全程在你的瀏覽器裡處理。
- 免費，在瀏覽器裡執行
- 網格或緊密排列
- JSON、XML 和 CSS
- 裁邊、留白、2 的次方尺寸
精靈圖製作範例
8 組專為這些範例製作的圖片，每組都用這款精靈圖製作工具合成了一張精靈圖。點開任一組，所有設定都能親手試一遍。
爆炸特效
8 個影格排在方形網格上，從火花一路到煙霧。
App 圖示
9 個大小不一的圖示，裁掉透明邊緣後緊密排列。
像素遊戲道具
8 件道具放大到 200% 緊密排列，像素依然銳利。
CSS 水果圖示
6 個圖示排成一行，直接當作網頁的 CSS 精靈圖。
太空貼紙
6 張貼紙排成 3 欄，放在 2 的次方尺寸的精靈圖上。
飛行的蝙蝠
4 個影格排成一欄，適合由上往下讀取的引擎。
西洋棋棋子
6 枚高矮不一的棋子，緊密排列並附帶 XML 圖集。
3 步完成精靈圖製作
三步完成，檔案全程不上傳。
拖曳、貼上或選擇 PNG、WebP、JPG 或 GIF 檔案，需要幾張就放幾張。可以依名稱排序，也可以拖曳調整順序。
動畫影格選等大格子的網格，大小不一的圖片選緊密排列。再設定裁邊、四周留白、間距和尺寸。
儲存精靈圖 PNG 和 JSON 或 XML 圖集、網頁用的 CSS 精靈圖，或把這些影格存成 GIF 動圖。
這款精靈圖製作工具最擅長什麼
它最拿手的六件事，從角色走路循環到一整頁網頁圖示都能處理。
圖片網格或緊密排列
網格給每個影格一樣大的格子，動畫順序不亂；緊密排列則把大小不一的圖片排進它能找到的最小精靈圖。
裁掉透明邊緣
空著的透明邊緣不佔空間，圖集仍記錄每張圖片的原始尺寸和偏移，遊戲裡的畫面不會錯位。
適配每種引擎的圖集
JSON 圖集採用 Phaser 和 PixiJS 讀取的 hash 格式；XML 圖集採用許多遊戲框架都能讀取的 Sparrow 和 Starling 格式。
網頁用的 CSS 精靈圖
精靈圖產生後，每張圖片對應一個寫好尺寸和位置的 class，網頁只需載入一張圖片，不必再載入幾十張。
動畫預覽和 GIF
依你設定的影格速率依序播放這些圖片，還能存成 GIF 動圖，方便分享或測試。
免費又保護隱私
這款精靈圖製作工具完全在你的瀏覽器裡執行：不上傳、免註冊、沒有浮水印，頁面載入完成後離線也能繼續使用。
精靈圖製作指南：做出貼合引擎的精靈圖
五個簡短技巧，幫你做出乾淨的精靈圖。
依順序替檔案命名
命名為 walk_1、walk_2 … walk_10 的檔案，用「依名稱排序」就能排對順序，數字依數值大小讀取；任何一張圖片都能拖曳換位置。
動畫用網格，圖示集用緊密排列
影格需要維持統一尺寸和位置時用網格；大小不一的圖示、道具和圖塊用緊密排列，更省空間。
裁邊並保留偏移
裁掉透明邊緣能讓精靈圖更小，讀取圖集的引擎會把每張圖片放回原位。依格子尺寸讀取的一般網格，保持裁邊關閉即可。
用留白防止滲色
精靈圖需要縮放或開啟材質過濾時，加上 1 到 2 像素的四周留白或間距，邊緣就始終乾淨，看不到相鄰的圖片。
留意精靈圖尺寸
尺寸顯示在預覽下方。用在手機上時，每邊維持在 4,096 像素以內；引擎有要求時，開啟「尺寸取 2 的次方」。
誰需要把圖片合成精靈圖
用精靈圖製作工具把多張圖片合成一張，常見的理由有這些。
遊戲開發者
把角色、特效和道具排進一張材質，附帶給引擎用的圖集。
網頁開發者
用 CSS 精靈圖把圖示合成一張圖片，減少請求次數。
像素畫師
排好動畫影格，匯出放大 2× 或 4× 的乾淨精靈圖。
模組作者和動畫師
為模組、工具和動畫軟體做出附 XML 或 JSON 圖集的精靈圖。
精靈圖製作常見問題
關於精靈圖產生、圖集和隱私的解答。
加入圖片，選擇網格或緊密排列，再下載精靈圖 PNG，以及你需要的圖集或 CSS。
免費。它完全在你的瀏覽器裡執行，免註冊帳號，也不加浮水印。
不會。圖片在你的裝置上讀取和排列，不會傳送到任何伺服器。
網格給每張圖片一樣大的格子，最適合動畫；緊密排列把大小不一的圖片排得盡量緊密，最適合圖示和道具。
Phaser、PixiJS 和大多數網頁引擎選 JSON，Sparrow、Starling 這類框架選 XML，網頁選 CSS。
不會。圖集保留每張圖片的原始尺寸和偏移，讀取圖集的引擎會把每個影格畫回原位。
可以。在「GIF 轉精靈圖」中開啟 GIF，它會讀出每個影格和時長，並排到一張精靈圖上。
電腦上最多 1,000 張，手機上最多 400 張，精靈圖每邊最大 16,384 像素。