圖片取色器 使用方法
- 1
開啟圖片
拖放、瀏覽選取或貼上截圖、照片或 Logo，大小上限 25 MB，支援 JPG、PNG、WebP、AVIF、HEIC、GIF 或 SVG。
- 2
用放大鏡瞄準
在圖片上移動或拖曳，11 × 11 像素的放大鏡會顯示十字準心下的確切像素及其 HEX 色碼。
- 3
點一下選色
取得 HEX、RGB、HSL 和 OKLCH 數值，每個都有專屬的複製按鈕。方向鍵可微調準心，按 Enter 即可選色。
- 4
擷取調色盤
選擇 5 到 12 種主要色彩，並複製成 CSS 變數、JSON 或 Tailwind 主題區塊。
限制與 Pro
一次處理一張圖片，上限 25 MB，不限選色次數，可擷取 5～12 種調色盤顏色，並保留 24 色歷史記錄。
Pro 方案可取樣高達 4 GB 的圖片。 查看 Pro
關於 圖片取色器
圖片取色器能讀取圖片中任何一個像素的精確色值，並把整張圖片轉成調色盤。每次選色都會以四種格式呈現：設計工具用的 HEX、CSS 用的 rgb() 與 hsl()，以及新式 CSS 色彩運用的 oklch()，其明度與彩度的變化更貼近人眼的感受。選取的顏色會記錄在最近 24 色的歷史記錄中，並保存在這個瀏覽器裡，下次開啟仍然看得到；在桌面版 Chrome 和 Edge 上，「從螢幕選色」還能透過瀏覽器的滴管取得頁面以外的任何顏色。
調色盤是在 OKLab 色彩空間中，以 k-means 分群演算法處理一份最長邊縮至 200 像素以內的圖片複本。相近的群組會合併，透明像素會被忽略，顏色則依占圖片的比例排序，每個色票都標示占比。同一張圖片永遠會得到相同的調色盤。
設計師可以用它從 Logo 擷取品牌色、依照片建立主題配色、確認截圖中按鈕的確切顏色，或是蒐集情境板素材。色值採用瀏覽器顯示圖片時的標準 sRGB，因此 JPG 的壓縮瑕疵或廣色域的來源圖片，可能讓結果與原始設計檔相差幾個單位。半透明像素只會回報顏色、不含透明度，本工具也不會替顏色命名或檢查對比度。
隱私
圖片只會在這個分頁中解碼與取樣，調色盤分群則在你開啟圖片後建立的小型 Web Worker 中執行，不會上傳任何內容。顏色歷史記錄只儲存在這個瀏覽器的本機儲存空間，「從螢幕選色」使用瀏覽器內建的滴管，只會把你選取的那一個顏色提供給本頁，不會分享其他資訊。
功能
像素級放大鏡
11 × 11 像素的放大鏡，支援鍵盤微調，滑鼠與觸控都能精準選色。
主色調色盤
以 OKLab 的 k-means 擷取 5～12 種顏色，並依占圖片比例排序。
開發者匯出
提供 HEX、RGB、HSL 和 OKLCH 數值，以及 CSS 變數、JSON 或 Tailwind @theme 區塊。
顏色歷史記錄
最近 24 次選色會保存在這個瀏覽器中，可複製成清單。