跳至主要內容
AI Sprite Maker

格線疊加工具

放大精靈圖或圖塊集,把格線畫在像素之間而不是像素上。適合教學、圖塊集文件與對齊檢查。

  • 免費
  • 本機執行
  • 免註冊
預覽

載入一張圖片開始。

所有處理都在你的瀏覽器中完成。檔案絕不會上傳,頁面載入後即使離線也能使用。

格線疊加工具使用教學

  1. 拖放精靈圖、圖集或圖塊集。格子尺寸會依影格網格自動推測。
  2. 設定格子寬度與高度(16×16 與 32×32 一鍵設定),如果圖塊不是從 0,0 開始,再設定偏移。
  3. 選擇線條顏色、不透明度與寬度;想要分區的話,每 2、4 或 8 格加一條主格線。
  4. 選擇匯出倍率,格線會位於放大後的像素之間。
  5. 下載 PNG。

你會得到什麼

  • 含格子格線的放大 PNG
  • 可選的 1px 細格線與主格線
  • 可選的外框

來自實際做遊戲的技巧

  • 教學請使用 8× 以上的倍率。在 1× 下格線只能蓋住像素,會擋到畫面。
  • 挑一個調色盤裡沒有的線條顏色(通常青色或洋紅就可以),免得讀者把線條和圖混淆。
  • 當你要說明一個由 16×16 圖塊拼成的 64×64 房間時,每 4 格一條主格線很有幫助。
  • 匯入 Tiled 或引擎之前,可以用偏移欄位檢查圖塊集是否有 1px 邊界。

使用情境

  • 替團隊或商店頁面製作圖塊集說明
  • 製作像素畫教學與步驟圖
  • 檢查精靈圖與 16 或 32 px 網格的對齊
  • 替關卡設計師準備參考圖

常見問題

格線會蓋住我的像素嗎?
倍率 2× 以上時,線條會畫在放大後像素之間的邊界上。在 1× 下像素之間沒有空間,線條會取代一排像素。
能用非正方形的格線嗎?
可以。格子寬度與高度可以分開設定,16×24 或 32×16 的格線都沒問題。
像素格線選項是什麼?
在格子格線底下顯示一層淡淡的 1 像素格線,倍率 4× 以上時才會顯示,方便一個個數像素。
匯出的 PNG 有多大?
原始尺寸乘以匯出倍率。最終尺寸會顯示在下載按鈕下方。
我的圖片會被上傳嗎?
不會,所有內容都在你的瀏覽器中繪製。
所有免費工具 →