圖片黑白轉換工具
將圖片轉換為黑白灰度效果，支援批量處理
拖拽圖片到此處，或點選選擇檔案
支援 JPG、PNG、WebP、BMP、GIF 格式，可一次選擇多張
什麼是圖片轉黑白？
圖片灰階轉換會移除色彩資訊，只用黑、白和不同深淺的灰色呈現影像。好的灰階效果不是把紅、綠、藍簡單平均，常見做法是使用 R×0.299 + G×0.587 + B×0.114 這類加權公式，因為人眼對綠色比藍色更敏感。這樣能更自然地保留亮度、對比和細節。灰階轉換常用於黑白攝影、文件掃描、證件照處理、列印測試、復古風設計和影像分析。若圖片是用顏色傳達資訊的圖表、地圖或介面截圖，轉換後應確認重要含義沒有被去色一併移除。
使用方式
使用方式
- 拖曳或點選上傳圖片（支援多選）
- 點選「轉換」按鈕進行批次處理
- 檢視結果，可單獨下載或一次下載全部
下載前須知
- 當對比度很重要時，請以實際尺寸預覽結果；灰階轉換可能會隱藏彩色警示或標籤。
- 若檔案用於設計審查、醫療、法律或產品文件，請保留原始圖片。
使用場景
技術原理
圖片灰階轉換將每個像素從 RGB 色彩空間轉換為單一亮度值，用於表示感知亮度。本工具使用亮度法（又稱加權平均法），定義於 ITU-R BT.601 標準（標準定義電視）：Gray = R * 0.299 + G * 0.587 + B * 0.114。這些係數反映了人類視覺系統的敏感度 — 視網膜的錐體細胞大致分為 64% 紅色敏感（L 錐體）、32% 綠色敏感（M 錐體）和 2% 藍色敏感（S 錐體），權重近似每個通道對感知亮度的亮度貢獻。綠色佔 58.7% 是因為人類視覺在光譜的綠黃區域（~555 nm）最敏銳。 作為比較，其他常見的灰階方法產生不同結果。平均法（Gray = (R + G + B) / 3）對所有通道一視同仁，紅色會過暗、藍色會過亮。HSL/HSV 色彩空間的去飽和法將飽和度設為零，比平均法感知上更準確但不如亮度加權。ITU-R BT.709（HDTV 標準）的 Luma 法使用略有不同的係數（0.2126、0.7152、0.0722），對具有不同白點的現代顯示器更準確。此處使用的 BT.601 係數仍是最廣泛實作的，在最廣泛的輸入影像範圍上產生自然的結果。 處理流程完全在瀏覽器中執行。上傳的圖片由瀏覽器原生圖片解碼器（支援 JPEG、PNG、WebP、BMP 和 GIF）解碼為 HTMLImageElement。透過 `ctx.drawImage()` 將圖片繪製到 Canvas 元素上，這會觸發瀏覽器的 GPU 加速合成器執行色彩空間轉換和縮放。`getImageData()` 讀回原始 RGBA 像素緩衝區為 Uint8ClampedArray — 每個像素佔用 4 個連續位元組（R、G、B、A），因此陣列長度為 width * height * 4。灰階迴圈以步長 4（i += 4）迭代，計算加權總和，並將相同的灰度值寫入所有三個 RGB 通道，同時保留原始 Alpha 通道。`putImageData()` 將修改後的緩衝區寫回 canvas。最後，`canvas.toBlob('image/png')` 將結果編碼為無損 PNG，`URL.createObjectURL()` 建立 blob: URL 作為下載連結。 對於批次處理，每個圖片依序處理以避免使主執行緒飽和 — 迴圈等待每個轉換完成後再開始下一個。canvas 在圖片之間被重複使用而非重新建立，避免 GPU 紋理配置的頻繁變動。原始 File 物件與灰階 Blob 一起保留，因此下載檔名可以從原始檔名加上 '_grayscale' 來衍生。
- ITU-R BT.601 亮度係數：R * 0.299 + G * 0.587 + B * 0.114 — 源自 CIE 1931 標準觀察者的明視光度函數，這些權重模擬了人類視網膜錐體細胞的分佈（L:M:S 約 64:32:2）以及在 555 nm（綠黃色）處的峰值敏感度。
- 方法比較：平均法 (R+G+B)/3 產生過暗的紅色和過亮的藍色；去飽和法（HSL S=0）較好但感知上不均勻；BT.709 Luma（0.2126R + 0.7152G + 0.0722B）對 HDTV 顯示器更準確，但此處使用的 BT.601 權重是瀏覽器和圖片工具中最廣泛支援的。
- Canvas 像素流程：`drawImage()` → GPU 合成器解碼和縮放 → `getImageData()` 讀取 RGBA Uint8ClampedArray → 逐像素加權總和迴圈（步長 4，i += 4）→ `putImageData()` 寫回 → `toBlob('image/png')` 編碼為無損 PNG → `createObjectURL()` 用於下載。
- Alpha 通道保留：Alpha 位元組（索引 i+3）被讀取但不修改 — 透明像素保持透明，原始 Alpha 值原封不動地傳遞，這對具有透明度或抗鋸齒邊緣的 PNG 圖片很重要。
- 依序批次處理：每個圖片透過 await 一次處理一張以避免主執行緒飽和 — canvas 元素在圖片之間重複使用，File 物件被保留以便從原始名稱加上 '_grayscale' 衍生下載檔名。
- Gamma 考量：BT.601 係數套用於 Gamma 編碼的 sRGB 值，而非線性光強度 — 這是標準做法，在顯示時產生視覺上正確的結果，但需要物理光測量的應用（科學影像、光度測量）應先將 sRGB 值線性化。
- 記憶體管理：每個灰階 Blob 透過物件 URL 保留在記憶體中，直到圖片被移除或頁面關閉 — 移除時呼叫 `URL.revokeObjectURL()` 可防止記憶體洩漏，當沒有引用時 Blob 的記憶體即被釋放。
範例
人像照片轉換
上傳彩色人像照片 → 點選轉換 → 取得藝術感黑白人像證件照處理
上傳彩色證件照 → 轉成黑白 → 符合部分證件照規格要求風景照藝術化
上傳風景照片 → 轉成黑白 → 突顯光影與構圖常見問題
圖片是在本機處理的嗎？
是。轉換是透過你瀏覽器內的 canvas 操作完成，圖片位元組不會上傳。可在「網路」分頁確認。
使用的是哪一種灰階公式？
預設採用感知亮度公式：gray = 0.299·R + 0.587·G + 0.114·B（BT.601）。它符合人眼對亮度的感受——綠色貢獻最大。部分頁面也提供 BT.709（0.2126/0.7152/0.0722，HDTV 使用）以及「平均值法」。
為什麼我的灰階圖看起來很平？
因為色彩本身帶有資訊，被轉成相同的灰階後就消失了。兩種亮度相近的不同顏色（例如同樣亮度的紅色與青色）會變得無法分辨。攝影上，有時用個別通道混合（多紅、少藍）會比標準公式產生更強烈的對比。
原本的色彩可以還原嗎？
不行。灰階轉換是有損的——色度通道已被丟棄。請務必把原始彩色檔與灰階副本一同保留。
可以輸出哪些格式？
預設使用 PNG 以保留品質。通常也提供 JPEG 與 WebP 以縮小檔案。多數格式中灰階圖仍以 3 通道 RGB（每像素 R=G=B）儲存；若要真正的單通道儲存，需要更專業的工具。
可以批次轉換多張圖片嗎？
可以一次拖入多個檔案——每張都在瀏覽器中獨立處理。實際限制是記憶體；總計數百 MB 的批次會讓瀏覽器變慢。
透明度怎麼處理？
alpha 通道會保留。PNG 與 WebP 維持原始透明；JPEG 則會把透明部分合成到白色背景，因為 JPEG 沒有 alpha。