圖片取色器

從上傳的圖片中選擇任意像素的顏色，並複製 HEX、RGB 或 HSL 色值。放大顯示可協助您精確選擇細小區域。

檔案與內容在您的瀏覽器中處理，不會上傳至我們的伺服器。

工具說明

上傳設計稿、截圖或照片，點擊任意像素即可複製對應的 HEX、RGB 或 HSL 色值。放大顯示可協助您精確選擇介面中的細小元素，也可用於從圖片中提取品牌顏色。

功能

點擊圖片選擇像素顏色
使用放大顯示精確定位
顯示 HEX、RGB 和 HSL 色值
將色值複製到剪貼簿
儲存本次使用期間最近選擇的顏色

使用方式

上傳圖片: 選擇包含目標顏色的圖片。
點擊像素: 移動滑鼠並點擊需要選擇的像素，放大顯示會顯示局部區域。
複製色值: 複製 HEX 色值，或複製可直接用於 CSS 的 rgb() 或 hsl() 格式。

範例

從舊版 PNG 設計稿中提取按鈕顏色
分析其他產品截圖中的配色
估算橫幅漸層中的顏色
在錯誤報告中記錄準確的色值

限制

工具只讀取圖片中的像素顏色；JPEG 有損壓縮可能導致輕微色差
工具不會自動產生整張圖片的完整調色盤
上傳的圖片會直接在您的瀏覽器中處理，不會傳送至伺服器。

常見問題

為什麼 JPEG 圖片的顏色可能略有不同？: JPEG 有損壓縮可能改變像素值。需要準確讀取介面顏色時，建議使用 PNG 截圖。
是否會讀取透明度？: 工具主要顯示不透明的 RGB 色值。讀取透明 PNG 時，複製的 rgba() 格式可以包含透明度。
可以在觸控裝置上取色嗎？: 可以。在支援的裝置上，點擊圖片即可選擇對應位置的顏色。