Combine Images 是一款瀏覽器工具,可接收二到十二個本地點陣圖檔案,並以水平、垂直或網格版面配置將它們排列成一張 PNG。輸出會保留每個輸入的原始像素尺寸,將較短的影像置中於所屬的儲存格內,且絕不拉伸、裁切或重新取樣任何單一來源。整個流程——解碼、排版、繪製、編碼、下載——都在當前的分頁中執行,因此原始檔案不會離開您的裝置。支援的輸入格式包括 PNG、JPEG、WebP、GIF、AVIF 與 BMP;而 SVG 則刻意被拒絕,因為外部參照與龐大的渲染指令會破壞受限的本地工作流程。每種版面配置選擇都會以解碼後的像素尺寸來放置影像,因此沒有任何來源會因為合併而失真。匯出的檔案使用瀏覽器內建的 PNG 編碼器,因此結果與您分頁逐像素繪製的內容完全相同。PNG 輸出能保留銳利的像素與解碼後的透明度,但所選的不透明背景會先被繪製,因此透明區域在最終檔案中會變成該顏色。

深入 Canva 的 Blend Image 應用程式
Canva 的 Blend Image 功能位於頂部工具列,而且只有在畫布上選取了單一影像元件時才會出現。控制選項包含一個不透明度滑桿,以及一組混合模式清單——Multiply、Screen、Overlay、Darken、Lighten、Color Burn 等——這些模式會針對作用中圖層的每個像素,與其下方的所有圖層重新計算。由於效果是作用於合成後的頁面上,兩張疊放的照片可以變成一張帶有色彩的照片、紋理可以加深或調亮人像、漸層可以覆蓋在平面插畫上。最終結果是一張 Canva 頁面,您可以將其匯出為 PNG、JPG、PDF,或以連結方式分享。
Blend Image 應用程式無法做到的是:接收多個本地檔案並將它們以獨立、原始像素的方式並排或以網格排列。圖層混合與拼貼排列是不同的問題:混合會在圖層重疊處混合顏色,而排列則會讓每個來源保持自身尺寸,僅在共享畫布上為其定位。如果工作是把三張商品照片排成一張橫幅、合併兩張截圖成一張對照圖,或建立一個置中的圖示網格,那麼 Blend Image 應用程式不是您該找的地方。
在 Canva 中使用 Blend Image 應用程式
在 Canva 中操作需要幾個明確的步驟,而且順序很重要,因為鎖定或群組化的元件會隱藏混合控制選項。
- 在設計中加入兩張以上的影像,並依您希望發生混合的位置將它們排列成一上一下。
- 點選上方的影像以將其選取。確認出現選取控點,且影像未鎖定;必要時按右鍵解鎖,並使用右鍵選單取消群組圖層,使其成為可單獨編輯的元件。
- 開啟畫布頂端的影像工具列。調整不透明度以柔化圖層,然後挑選一種混合模式——Multiply 會變暗、Screen 會變亮、Overlay 會增加對比——將顏色與下方內容合併。
- 如果兩張照片之間出現明顯接縫,請用漸層元件、柔邊形狀、裁切框,或前景物件(例如葉叢、紙張紋理或漏光效果)來遮蓋接合處。
- 當混合效果看起來滿意時,將頁面匯出為 PNG、JPG 或 PDF。合成後的頁面會保留該效果,而來源影像在您匯出之前會一直作為獨立圖層保存在 Canva 中。
這是在畫布內進行分層合成時的正確工作流程。如果是要將一排、一列或一個網格的本地檔案合併成編輯器外部的一張靜態 PNG,則更適合採用不同的做法。
什麼時候本地合併更合適
將二到十二張本地照片排列成一張 PNG,是與使用混合模式進行分層不同的一個問題。最終結果不是一張像素混合的合成影像,而是單一畫布承載著每個來源的原始尺寸、依選定順序排列、並使用選定的背景。這正是 Combine Images 工具 在您瀏覽器中所做的事。它接受 PNG、JPEG、WebP、GIF、AVIF 與 BMP,依瀏覽器讀到的順序進行排列,並匯出一張內含所有未經更動之輸入的 PNG。
本地做法對於敏感素材也很重要。由於解碼、排版計算、繪製、PNG 編碼與下載產生都在當前的分頁內進行,原始檔案絕不會被傳送到伺服器。如果某個專案混用了客戶商標、商品攝影或私人截圖,這道隱私界線便是工作流程的一部分。Canva 會將設計狀態上傳到其伺服器以進行儲存與分享,這對雲端原生專案來說沒問題,但如果目標只是合併幾張影像並下載一個檔案,就會增加額外負擔。如需進一步了解兩種工作流程的比較,以及各自設計用途,請參閱 如何在 Canva 及其他場景使用 Blend Image 應用程式。
如何將二到十二張照片合併成一張 PNG
合併工作流程分為三個明確的步驟,而每一步都會將計算結果傳遞給下一步。
- 依您想要的排列順序,挑選二到十二張支援的點陣影像。瀏覽器會保留該順序,因此第一個檔案在水平模式中會位於最左側,在垂直模式中則位於最上方。
- 選擇水平、垂直或網格版面配置,然後設定間距與背景顏色。間距是介於 0 到 100 之間的整數像素值,背景則是一組六位數的顏色,用來填滿未使用的畫布空間以及影像之間的區域。
- 選擇「Combine images」(合併影像),確認版面配置後顯示的輸出尺寸,然後下載所產生的 PNG。該檔案使用瀏覽器的 PNG 編碼器建立,因此儲存的檔案會與您分頁所繪製的內容相符。
如果第二步拒絕了某個檔案,幾乎都是因為位元組損毀、編解碼器不支援,或是輸入為 SVG。SVG 是刻意排除的;本工具僅設計用於瀏覽器可解碼的點陣格式。如果您需要先轉換向量,請先透過 SVG 轉點陣圖的轉換器處理,然後再回到此步驟。
版面配置選項:水平、垂直與網格
共有三種確定性的版面配置,每一種都會根據解碼後的整數尺寸計算輸出大小。它們都不會拉伸、裁切或縮放來源。
| 版面配置 | 方向 | 輸出寬度 | 輸出高度 | 空白規則 |
|---|---|---|---|---|
| 水平 | 左 → 右 | 各寬度總和 + 間距 | 最高的影像 | 較短的影像垂直置中 |
| 垂直 | 上 → 下 | 最寬的影像 | 各高度總和 + 間距 | 較窄的影像水平置中 |
| 網格 | 上限(√數量) 個欄 | 欄數 × 最大寬度 + 間距 | 列數 × 最大高度 + 間距 | 空白儲存格與未用的留白顯示背景顏色 |
以水平橫列來說,計算方式是具體的:三張解碼後寬度為 400、600 與 500 像素的影像,加上 20 像素的間距,會產生一張 400 + 20 + 600 + 20 + 500 = 1540 像素寬的畫布,輸出高度等於最高的影像。兩張較短的影像會以該最大高度為基準垂直置中,因此整列看起來平衡而不需要重新取樣。
網格版面配置會使用最接近正方的欄數,也就是影像數量平方根的上限。四張影像會形成 2 × 2,六張為 3 × 2,九張為 3 × 3,十張則為 4 × 3 並包含兩個空白儲存格。每個儲存格都以最寬與最高的解碼後影像作為邊界;每個來源會在所屬儲存格內置中而不被拉伸。空白儲存格以及較短來源周圍的留白會顯示所選的背景顏色。
檔案限制、透明度與動畫行為
在三個軸上存在硬性限制:每個檔案的位元組數、總位元組數,以及畫布幾何尺寸。每個來源檔案不得超過 25 MiB,所有選定檔案的總和不得超過 100 MiB,合併後的畫布任一邊不得超過 8192 像素,總面積不得超過 3200 萬像素。這些數字是用來避免可能導致瀏覽器分頁當機的記憶體暴漲,而非作為軟性上限的宣傳。如果檔案選擇器讓您選取了某個項目,但版面配置步驟卻沒有回傳結果,該輸入很可能超過上述其中一項限制,或是無法解碼。
透明度會被視為畫布繪製順序的一部分。本工具會先繪製所選的六位數背景,然後依選定順序將每張點陣圖繪製於其上。PNG 會保留銳利的像素與解碼後的透明度,但由於背景是不透明的且會先被繪製,因此來源中的透明區域在匯出的 PNG 中會變成該背景顏色。
動畫 GIF、WebP 或 AVIF 輸入僅會貢獻瀏覽器在其影像點陣圖路徑上所解碼的單一畫格。動畫不會保留於輸出中。匯出的檔案是一張靜態 PNG,不含任何中繼資料、EXIF、色彩描述檔、原始檔名或圖層。如需用於印刷生產或需要色彩管理的合成,請在將該 PNG 送往後續流程前,於專用軟體中加以驗證。
依用途挑選版面配置
挑選版面配置,主要取決於您心中已能想像的畫布形狀。水平橫列適合橫幅式合成、前後對照,以及每個來源都需要對齊同一基線的時間軸條。垂直欄位適合情緒板、逐步操作的截圖,以及讓讀者向下滑動瀏覽的 Pinterest 風格圖釘。網格則適用於商品型錄、角色立繪、聯絡表以及圖示組,這類場景中均勻的儲存格能讓眼睛在眾多項目間保持平靜。
另外還有兩個實務細節會影響選擇。第一,間距是介於 0 到 100 之間的整數像素值,同時控制視覺分隔與數學計算;間距為 0 表示影像相鄰,而較寬的間距會在每個來源周圍營造類似海報的框線。第二,背景顏色是每個空白儲存格與畫布邊框會顯示的顏色,因此刻意挑選能讓您建立一致的品牌色,或為下游擺放建立透明的匹配。由於影像維持在原始解析度,因此結果不會比您輸入的最差來源更差。
在按下合併之前,請先在紙上做一次驗算:輸出寬度與高度都應小於 8192 像素,總像素數應少於 3200 萬,所有檔案大小總和也應遠低於 100 MiB。如果這些數字都通過,版面配置步驟就會成功;若不行,請先縮小來源或進行壓縮,然後再回到合併步驟。
如需更深入的說明,請參閱 佔位影像產生器替代方案:略過遠端 URL。