將一張圖片分割成網格，代表將一張原始圖片切成一個由較小、獨立的圖檔組成的矩形陣列——例如，切成 3 排 3 欄的等尺寸 PNG 圖塊，在 Instagram 輪播貼文中讀取時仍會呈現為一張完整的圖片。Image Grid Splitter 可以在你的瀏覽器中本機處理 JPG、PNG 或 WebP 檔案：行列範圍為 1 到 10 之間，總圖塊數上限為 100，無需上傳。每個輸出的圖塊都使用來源圖片的原始像素尺寸，而非縮小的預覽，因此一張 1200 × 900 的相片切成 3 排 4 欄時，會產生 12 個 300 × 300 的 PNG，按照閱讀順序重新組合後，能完全重現原始圖片。這個工具透過比例化的整數邊界來強制達成這點，這代表一個寬度為 10 像素的來源圖切成 4 欄時，會變成 2、3、2、3 像素的寬度——四個寬度相加為 10，最寬與最窄的差距為 1 像素，不會遺失任何細長條狀的區域。結果列表會顯示每個圖塊的精確寬度、高度，以及大約的編碼檔案大小，讓你一眼就能找出差一錯誤的圖塊，並依照正確順序下載 PNG 以便上傳。
將圖片分割成網格究竟做了什麼
網格分割其實就是一張圖的矩形平鋪。你決定要將圖片切成幾排幾欄，工具就會產生對應數量的獨立圖檔，而不是一個。每個檔案都是原圖的一塊，這些圖塊可以完全拼合，因此只要你再次並排組合，就能還原回來源圖片，既不會缺少也不會重複任何部分。
這個概念比網頁應用程式還要古老——設計師和印刷業者數十年來一直使用網格切割的方式，將大型藝術作品拆成容易處理的小塊、將圖片排入固定的頁數，或製作實體拼圖。如今線上網格分割工具之所以流行，是因為目前最常見的分割需求與社群分享有關：一張過寬、無法放入方形 Instagram 貼文的單張照片，會被切成 3 × 3 的網格，以輪播形式上傳，而 Instagram 會一張一張顯示這些圖塊，讓觀看者透過滑動輪播來看到完整圖片。
針對這種用途——以及像是製作照片比較、教室海報、分鏡表版面，以及過去常見的「碎片化封面照片」手法等相關用途——重要的是分割必須精準、檔案名稱能標示上傳順序，且圖塊保持完整解析度。這就是我們下方所介紹工具的設計目標。
常見的網格版面及其用途
3 × 3 網格是 Instagram 標準的分割方式：九個方形圖塊，在輪播貼文中讀取時呈現為一張完整的圖。這也是「how to split image into grid」最常見的搜尋原因，而你只需要從來源照片取得一張寬幅的橫向圖片，長寬比為 3:1。將其切成三欄三排，你就能得到九個等大的正方形，Instagram 會將其視為單一輪播。
| 版面 | 常見用途 | 產生圖塊數 |
|---|---|---|
| 1 × 2 | 並排的前後比較 | 2 |
| 2 × 2 | 四格拼貼或比較表 | 4 |
| 3 × 2 | 六格分鏡或漫畫框 | 6 |
| 3 × 3 | 全景圖的 Instagram 輪播分割 | 9 |
| 4 × 4 | 16 格拼圖或網格海報 | 16 |
| 5 × 5 | 高密度拼圖或縮圖網格 | 25 |
這些版面是慣例而非硬性規定——你可以從 1 × 1（不分割）到 10 × 10 之間自由選擇任意組合，10 × 10 是工具的硬性上限，會產生 100 個圖塊。這些版面之間的差異在於你會下載多少檔案，以及每個圖塊的形狀。一張橫向照片以 3 × 3 分割會產生正方形圖塊；同一張照片以 4 × 3 分割則會產生較寬的矩形；一張直向照片以 3 × 3 分割則會產生垂直的矩形。工具始終根據來源圖片的實際像素尺寸來推算圖塊尺寸，而非依據縮小後的預覽，因此圖塊會維持你最初解析度的清晰度。
如何在瀏覽器中將圖片分割成網格
整個工作只需要在瀏覽器中完成三個步驟。無需上傳、無需帳號、無需安裝軟體——分割器會解碼檔案、在離螢幕的畫布上繪製圖塊、將其編碼為 PNG，並提供一組下載連結給你。
- 選擇本機的 JPG、PNG 或 WebP。在工具頁面上使用檔案選擇器，選擇存在於你電腦中的圖片。接受最大 25 MiB 的檔案，以及每邊最多 20,000 像素（總計 40 百萬像素）的圖片；任何超出此範圍的檔案會在任何處理開始前，以明顯的錯誤訊息被拒絕。
- 輸入你的排數和欄數。排數和欄數請輸入 1 到 10 之間的數字。兩者的乘積就是會得到的圖塊數量，硬性上限為 100 個。若要做 Instagram 3 × 3，請將排數設為 3，欄數也設為 3。
- 選擇分割圖片。工具會計算邊界、以來源圖片的原始像素尺寸將每個圖塊繪製到各自的畫布上，並依閱讀順序列出所有圖塊（先列出第一排，再從左到右）。
- 檢查圖塊尺寸並下載。結果列表中的每個圖塊都會顯示其精確的像素寬度與高度，以及大約的編碼檔案大小，並附上一個下載按鈕。點選你想要的圖塊（或全部下載），並以工具指定的「排-欄」命名方式儲存。
你可以在短短幾分鐘內透過 Image Grid Splitter 完成這個工作。產生的圖塊會以原始檔案的基底名稱加上排號和欄號來命名——例如 photo-row-2-column-3.png——因此它們會依上傳順序排序，無需猜測哪個圖塊應該放在網格中的哪個位置。
圖塊尺寸如何計算
圖塊尺寸取自來源圖片的原始像素尺寸，而非任何螢幕上預覽的尺寸。對於可以均分的圖片來說，計算方式就是直接相除。一張 1200 × 900 的圖片分成 3 排 4 欄時，圖塊尺寸為 1200 ÷ 4 = 300 像素寬，以及 900 ÷ 3 = 300 像素高。結果是 12 個正好 300 × 300 的圖塊，總共涵蓋 1200 × 900 = 1,080,000 像素——與來源相同，沒有重疊也沒有缺少像素。
當來源尺寸無法整除時，分割器會使用比例化的整數座標，讓每個來源像素仍只屬於單一圖塊，且相鄰圖塊之間不會產生間隙。產品本身的範例：一個寬度為 10 像素的來源切成 4 欄時，會變成 2、3、2、3 像素的寬度。四個寬度相加為 10，最寬與最窄的差距為 1 像素，且不會丟棄任何細長條狀的部分。同樣的規則也獨立套用於高度：一個高度為 7 像素的來源切成 3 排時，會產生 2、2、3 像素的高度，這同樣滿足總和規則與單像素差距規則。
工具會拒絕任何會產生零像素圖塊的網格。從一張只有 2 像素高的圖片中切出 3 排是不可能的，因此分割器會顯示錯誤訊息，而不是產生空白的 PNG。這是有意為之——這個設計將產生誤導性輸出（悄悄產生空白圖塊，或將圖塊填補成統一尺寸）視為比拒絕請求更糟糕的狀況。
檔案限制、格式與圖塊命名方式
在開始前有幾項硬性限制值得了解，因為分割器會在一開始就強制執行這些限制，而不是產生損壞的輸出。
| 限制 | 數值 | 存在的原因 |
|---|---|---|
| 支援的輸入格式 | JPG、PNG、WebP | 瀏覽器原生即可解碼這些格式 |
| 最大檔案大小 | 25 MiB | 避免過大的檔案造成分頁卡住 |
| 每邊最大像素數 | 20,000 | 保護離螢幕畫布的配置 |
| 最大總像素數 | 40 megapixels | 同樣的保護，套用於面積 |
| 排數 × 欄數 | 各自 1–10，總圖塊數上限 100 | 讓結果列表保持在可管理的範圍 |
| 輸出格式 | 一律為 PNG | 保留精確的圖塊邊界與來源透明度 |
每個圖塊都會在一個符合來源矩形原始像素尺寸的畫布上進行繪製，然後編碼為 PNG。整個過程沒有重新取樣、沒有內插、沒有邊框或填補，也沒有重新壓縮成有損格式。JPEG 或 WebP 的來源會被解碼後重新編碼，這代表原始的壓縮位元組以及任何來源中繼資料（EXIF、ICC 設定檔、XMP）都不會保留，即使可見的像素區域是被精確保留下來的。若要達到像素級的精準度與透明度，PNG 是正確的輸出格式；如果你想要較小且具備有損壓縮的檔案，之後可以使用其他工具將 PNG 轉換為 JPG。
檔案名稱遵循嚴格的模式：原始基底名稱-row-N-column-M.png。一張名為 sunset.jpg 的照片以 3 × 3 分割時，會產生從 sunset-row-1-column-1.png 到 sunset-row-3-column-3.png 的檔案。依字母順序排序會對應到結果頁面上的閱讀順序，而這個順序也就是 Instagram 輪播的上傳順序。如果最後一排或最後一欄恰好比其他排欄寬或高出一個像素——例如寬度 1201 像素切成 4 欄會產生 300、300、300、301 的寬度——以「排-欄」命名的方式仍能清楚標示每個圖塊的身分，而不是讓尺寸異常的圖塊變成無從辨識。
更改來源檔案或任一網格值，會使先前的結果列表失效，而用來支援下載按鈕的暫存瀏覽器網址，會在被取代時或你關閉工具時立即撤銷。不會有任何資料在目前的分頁之外持續保存。
When a different tool is the better fit
The Image Grid Splitter is built for one focused job: a uniform row-by-column grid of one image, processed locally, with pixel-exact output. A few related tasks need a different tool because they ask for something the splitter deliberately doesn't do:
- Custom slice positions, bleed, or gutters. Print production and design templates usually need manual slice guides, overlap for seam trimming, or whitespace between tiles. Use an editor that supports manual slice positions instead.
- Detecting content automatically. Splitting a comic page by panel or a contact sheet by photo isn't a uniform grid. The splitter doesn't detect faces or content; it just divides by row and column.
- Overlapping slices. A panorama that's meant to overlap so the seams can be aligned isn't a clean grid split. The splitter's tiles meet exactly once with no overlap and no padding.
- Optimizing the output PNGs. The splitter preserves every pixel exactly and never recompresses, which keeps file sizes honest. If you want smaller PNGs after splitting, run them through a separate PNG optimizer or convert them to JPG.
For related operations that don't need slicing — resizing to a target dimension, cropping to a custom aspect ratio, compressing file size, or combining several images into one PDF — the image category has dedicated tools that work the same way: locally, in the browser, with no upload. The grid splitter's role is specifically the divide-by-rows-and-columns job, and it stays focused on that.
Related reading: How to Split GIF Into Images.
Related reading: Split Images for an Instagram Grid in Canva or Browser.