無需上傳, 100% 本機處理, 無需帳戶

顏色調色盤擷取器

上傳圖片以擷取其主要顏色。取得每個色塊的 HEX 代碼,一鍵複製。一切在你的瀏覽器中執行。

顏色調色盤擷取器 的運作方式

色彩調色盤提取器分析你的圖片,並使用針對 Canvas 中像素資料執行的 k-means 群集演算法,識別視覺上最主要的顏色。結果是一組帶有 HEX 值的色彩色塊,可以個別複製。沒有圖片位元組離開你的瀏覽器;像素取樣在 Web Worker 中於本機執行,讓主執行緒保持響應。

提取過程將數十萬個個別像素顏色分組為較少數量的代表性群集。輸出顏色的數量是可設定的,你可以提取緊湊的五色調色盤,或更廣泛的十二色組合。這有助於快速從標誌中提取品牌顏色、識別照片的主色調以製作情緒版,或查看使用者上傳圖片中出現了哪些顏色。

顏色調色盤擷取器 的分步使用說明

  1. 將圖片拖曳到上傳區,或點擊瀏覽。
  2. 設定你想提取的顏色數量(通常為 5 到 12 個)。
  3. 點擊「提取」。像素群集在 Web Worker 中於本機執行。
  4. 查看產生的色彩色塊及其 HEX 值。
  5. 點擊任何色塊將其 HEX 代碼複製到剪貼簿。

常見使用情境

  • 設計師從品牌照片中提取主色調,確保新的行銷素材符合現有的色彩故事。
  • 開發者識別使用者上傳頭像中的主要顏色,以動態生成相配的 UI 強調色。
  • 藝術家從數張參考圖片中提取調色盤,比較提取的 HEX 代碼,建立參考情緒版。
  • 部落客從標題照片中提取五個主色調,為貼文版面選擇互補的文字和按鈕顏色。

常見問題

色彩提取演算法是如何運作的?

工具透過 Canvas.getImageData() 讀取圖片中的所有像素值,為了速度而對其進行降採樣,然後執行 k-means 群集。每個群集的中心點就成為輸出顏色之一。k-means 依顏色鄰近性對像素進行分組,使主要視覺色調以中心點顏色的形式呈現。

提取顏色需要上傳圖片嗎?

不需要。像素取樣在你的瀏覽器的 Web Worker 中進行。圖片從你的本機磁碟讀取,繪製到 OffscreenCanvas 上,像素陣列在記憶體中處理。資料不會離開你的裝置。

為什麼提取的顏色看起來與我在圖片中看到的顏色略有不同?

k-means 中心點代表一群像素顏色的數學平均值。一種非常常見但略有差異的顏色(例如有輕微漸層變化的藍天)會產生平均色調的中心點,而不是你能指出的任何確切像素值。結果是代表性的平均值,而不是特定像素的取樣。

我可以從具有透明度的照片中提取調色盤嗎?

完全透明的像素(alpha = 0)會從群集中排除,以避免透明區域使提取的顏色偏向黑色或白色(取決於 Canvas 背景填充)。半透明像素按其 alpha 值加權包含在取樣中。

顏色代碼是什麼格式?

工具輸出 HEX 代碼(例如 #3A7BD5)。如果你需要 RGB、HSL 或其他格式,請將 HEX 值複製到「顏色轉換器」工具中,它接受 HEX 並轉換為所有常見的顏色模型。