在 Canva 裡幫圖片加邊框大約只要十秒:點選畫布上的圖片,打開「Effects」面板,開啟「Surround」濾鏡——這是一個內建選項,能為圖片加上一圈均勻的色框,並用兩個滑桿控制。Surround 會套用到目前選取的元素,所以照片、插圖、商標甚至文字方塊都能使用,而且每個 Canva 帳號都內建這項功能,不會被鎖在 Pro 方案之後。邊框會固定附著在設計中的該元素上,這讓 Surround 特別適合用在「加了邊框的圖片還要和頁面上其他元素放在一起」的情況。
問題在於 Surround 是活在 Canva 編輯器裡的功能。如果你真正想要的是一張存到電腦裡、帶邊框的 PNG,用在電子郵件簽名、Etsy 商品頁、簡報投影片或列印講義上,就需要另一種做法。Canva 的下載按鈕永遠是匯出整份設計,而不是單一個帶邊框的圖片元素,而且大型設計的算繪與打包可能要花上好幾分鐘。對許多讀者來說,更快、也更能保護隱私的做法,是先在 Canva 之外用本機瀏覽器工具加邊框,如果之後還需要,再把結果放回設計中。

如何在 Canva 中為圖片加上邊框
Canva 提供兩種實用的方式來為圖片加框:Surround 效果(最簡單的做法)與用矩形圖形手動製作的框(對角落樣式與偏移量有更多控制)。以下是 Surround 的做法,也是大多數搜尋這個關鍵字的讀者真正想要的方法。
- 開啟你的 Canva 設計,或新建一份,然後點選畫布上的圖片以選取它。邊緣會出現紫色的外框,確認已選取成功。
- 在上方工具列點選「Effects」。它位在編輯器工具列上「Transparency」與「Animate」之間。
- 在 Effects 面板中向下捲動到「Surround」這個項目,它顯示為大方框裡有個小方框的圖示,點選它。青綠色的切換開關會確認效果已開啟。
- 拖曳「Thickness」滑桿以加寬或縮窄邊框。預覽畫面會即時更新,且畫布縮放會讓設計維持置中。
- 點選「Surround」標題下方的色塊來選擇邊框顏色。你可以從 Canva 的調色盤中選擇、輸入自訂的十六進位色碼,或使用取色工具從圖片本身取樣色調。
- 點選已選取圖片以外的任何位置以取消選取。此時邊框已經固定套用在你畫布上的該元素中。
- 若要單獨匯出帶邊框的圖片,把它拖到一個畫布大小等於圖片加上邊框的空白設計中,然後選擇「Share」→「Download」→「PNG」,如果希望這張帶框圖片能放在任何背景上,記得選擇透明背景。
對大多數日常需求來說——為肖像加框、把圖示從有色背景中分離出來,或為商標加上乾淨的邊緣——Surround 都是合適的選擇。如果你需要圓角邊框,或只在特定幾側偏移的框,就得用矩形圖形手動製作,這需要更多點擊次數,也需要多一點耐心。
加邊框更快的本機替代方案
Canva 的編輯器很適合處理版面配置工作,但它需要帳號、穩定的網路連線,以及在大型設計上可能感覺緩慢的算繪與下載步驟。如果你真正想要的只是「在我的圖片周圍畫一圈色框,然後給我 PNG 檔」,你可以完全跳過 Canva,改用Add Border to Image工具。它在你的瀏覽器分頁中執行,在本機處理圖片,並回傳一張你可以一鍵儲存的全解析度 PNG。
因為檔案從不離開你的裝置,這個工具很適合私人照片、進行中的客戶案件,或任何你不想放在第三方伺服器上的圖片。輸出結果是單一張帶邊框的 PNG,而不是完整的設計檔,這通常正是你把帶框圖片放進簡報投影片、Etsy 商品頁或列印講義時想要的形式。
如何使用 Add Border to Image 工具
- 開啟 Add Border to Image 頁面,點選上傳區域,或把本機的 JPG、PNG 或 WebP 檔案拖曳上去。頁面會顯示輸入檔案在處理前必須符合的檔案大小與解碼後尺寸限制。
- 在「Border (px)」欄位輸入整數的邊框寬度。可接受 1 到 500 之間的任何整數;超出這個範圍的數值會被拒絕,這樣畫布才不會無限制地變大。
- 選擇邊框顏色。顏色欄位需要六位數的十六進位色碼,例如白色是 FFFFFF,接近黑色則是 1A1A1A。即時預覽色塊會顯示你目前選擇的顏色。
- 點選「Add border」。工具會解碼你的圖片,用選定的不透明顏色填滿擴大後的畫布,在邊框偏移量的位置繪製一次你的圖片,編碼成 PNG,並把新尺寸和原始尺寸並排顯示,讓你可以確認變化。
- 點選「Download」儲存帶邊框的 PNG。變更檔案、邊框寬度或顏色都會自動使前一次的結果失效,所以你不會不小心保留了舊版本。
邊框工具會改變什麼(以及不會改變什麼)
這個工具是把邊框加在原始圖片的外側,而不是疊在圖片上面。在一張 1000×800 的來源圖上加 20 像素邊框,會產生一張 1040×840 的 PNG——寬度加 40 像素、高度加 40 像素,來源圖放在 x=20、y=20 的位置——每個來源像素都會維持原本的座標。因為畫布會先用選定的不透明顏色填滿擴大後的區域,再於邊框偏移量的位置繪製一次解碼後的來源圖,所以沒有任何來源像素會被裁切、拉伸、重新取樣、模糊化,或被邊框蓋住。
| 能力 | Canva Surround | Add Border to Image(瀏覽器) |
|---|---|---|
| 需要帳號 | 是 | 否 |
| 圖片上傳到伺服器 | 是(Canva 雲端) | 否,完全在本機處理 |
| 邊框寬度控制 | 連續滑桿 | 1–500 px 的整數 |
| 顏色輸入 | 調色盤 + 十六進位色碼 + 取色器 | 僅限六位數十六進位色碼 |
| 各邊獨立的邊框寬度 | 是 | 四邊寬度相同 |
| 圓角、漸層、陰影 | 可透過圖形達成 | 否——僅提供實心矩形框 |
| 輸出格式 | 存在於 Canva 設計中 | 全解析度 PNG 下載 |
| 最大輸出尺寸 | Canva 畫布 | 20 百萬像素 |
| 邊框內保留透明度 | 視設計而定 | 是,圖片區域內保留 Alpha 值 |
這個工具也會在加上邊框之後,強制執行 20 百萬像素的輸出上限。在已經很大的圖片上加超大邊框,可能會讓結果超過這個上限,此時頁面會顯示明確的錯誤訊息,而不是產生損毀的檔案。檔案超過 25 MiB,或解碼後尺寸極端,都會在任何繪製工作開始之前,就被輸入檢查機制拒絕。
來源圖片中原本透明的像素,在圖片區域內仍會保持透明,而新加的外圈邊框則是不透明的。如果你的圖片原本是帶透明背景的 PNG,畫面中央會保留透明度,邊框只會填滿新增的外圈區域。輸出永遠是 PNG,因此任何來源 JPEG 都會被解碼並重新編碼,即使像素數量只增加一小部分百分比,檔案通常還是會變得稍大一些。
選擇合適的邊框寬度與顏色
邊框寬度大多是呈現風格的選擇,但有幾個經驗法則能讓結果看起來平衡。4–8 px 的邊框是縮圖與大頭貼常見的網頁尺寸;10–20 px 看起來像列印照片上乾淨的卡紙邊;40 px 以上適合用在海報、社群卡片,或任何需要讓圖片與雜亂背景明顯區隔的場合。超過 100 px 就開始看起來像卡紙邊框,這對產品模擬圖來說很合適,但用在日常用途上就顯得笨重。
顏色選擇通常取決於圖片將要放置的表面。白色邊框(FFFFFF)能讓深色圖片在淺色頁面上更突出;黑色邊框(000000)則能讓淺色圖片在深色頁面上更穩重。對於 Etsy、Shopify 或型錄縮圖,淺灰色(E6E6E6)或米白色(F5F5DC)的中性邊框,看起來就像柔和的卡紙邊,又不會搶走產品的風采。如果你需要精確的品牌色,請直接在顏色欄位輸入六位數十六進位色碼,而不是從螢幕上取樣——螢幕取樣會因螢幕校色與頁面背景而產生偏差。
這個瀏覽器工具只接受單一純色,並對每一邊套用相同的寬度。它沒有分別控制上、下、左、右的滑桿,沒有圓角、沒有漸層、沒有陰影,也沒有裝飾圖樣。如果你需要這些功能,下一步應該使用完整的圖片編輯器,而不是硬找變通辦法。
什麼時候該選 Canva、什麼時候該選瀏覽器工具
當邊框是更大版面配置的一部分時——例如社群貼文、傳單,或同時包含文字、圖示與其他設計元素的投影片——請使用 Canva。編輯器內的 Surround 能讓一切保持對齊,而 Canva 標準的設計流程能在同一個地方處理下載與分享。當帶邊框的圖片本身就是最終交付物,而不是更大畫布中的一部分時,尤其是來源圖片較敏感,或你想要快速、不需登入的結果時,請使用本機瀏覽器工具。
這兩種工作流程並非互斥。許多設計師會先用瀏覽器工具加上邊框,再把產生的 PNG 放進 Canva 中排版。這種做法能讓帶框圖片在匯出時保持清晰,也能避免 Canva 對多圖層設計套用的輕微壓縮。
如果你的圖片需要本機工具沒有提供的功能——圓角、投影陰影、浮水印、印刷出血,或用於專業印刷的色彩管理輸出——請在桌面編輯器中開啟檔案。Add Border to Image 工具刻意只專注於一件事:在 JPG、PNG 或 WebP 圖片周圍畫出四邊寬度完全相同的矩形實心框,並回傳一張 PNG 給你。正是這種專注,讓結果保持快速、私密且可預期。
如果你還在權衡選項,A Local Browser Image Filter Effects Alternative有詳細說明。
如果你還在權衡選項,Convert SVG to JPG in Canva (or Your Browser)有詳細說明。