圖片顏色提取
上傳圖片，在圖片上任意點擊即可精確提取該點的顏色，並輸出為 HEX、RGB 和 HSL 格式。
點擊圖片上的任意位置來提取顏色
關於此工具
QuickKit 圖片顏色提取工具讓您上傳任意圖片，在圖片上點擊任意位置即可提取該像素的精確色碼，並即時顯示 HEX、RGB 和 HSL 三種格式。適合設計師從截圖中識別品牌色彩、開發者取樣 UI 顏色，或任何需要精確識別圖片特定位置色彩的使用者。
功能特色
- ✓像素級精確取色 — 點擊圖片任意位置，透過 Canvas getImageData API 讀取該點精確的 RGBA 值。
- ✓三種格式輸出 — 每次取色同時顯示 HEX、RGB 和 HSL 格式，方便您直接套用至專案。
- ✓即時色彩預覽 — 取色後即時更新顏色預覽色塊，方便視覺確認。
- ✓一鍵複製 — 每種格式（HEX、RGB、HSL）都有獨立的複製按鈕。
- ✓本地端處理 — 圖片載入至瀏覽器的 Canvas 元素中處理，不會上傳至伺服器。
常見問題
- 為什麼取色結果與螢幕所見顏色略有差異？
- Canvas 讀取的是原始像素資料。螢幕的色彩設定（如 sRGB、Display P3）與瀏覽器渲染可能造成視覺效果與實際數值之間的些微差異。
- 可以從截圖中取色嗎？
- 可以。截圖後儲存為圖片檔，上傳至此工具，點擊任意位置即可取得顏色。
- HEX、RGB、HSL 有什麼差別？
- HEX 是 CSS 常用的六位十六進位表示法；RGB 以 0–255 表示紅、綠、藍三個通道；HSL（色相、飽和度、亮度）在手動調色時較為直覺易用。
- 支援透明圖片嗎？
- 支援，Alpha 通道會被讀取，但介面只顯示 RGB 值。完全透明的像素會顯示為黑色（rgb 0,0,0）。