使用方式
- 選擇一張圖片，或將圖片拖曳到方框中。
- 將游標移到圖片上；放大鏡會顯示其周圍的像素。
- 按一下或輕觸即可選取顏色，並複製為 HEX、RGB 或 HSL。
- 向下捲動查看主要顏色，選擇您要的數量，然後複製或下載為 CSS 變數。
運作方式
影像會繪製到瀏覽器中的畫布上，並從指標下方的精確像素讀取顏色。放大鏡會顯示放大的 11 × 11 像素區域，並以框線標出所選像素。邊長超過 4096 像素的影像會先縮小，因此在非常大的照片上，選取的一個像素會是數個原始像素的平均值。
主色是使用 k-means 分群找出：像素會先分為 32,768 個小顏色桶，然後將這些桶依您選擇的顏色數量合併，並以每個桶包含的像素數加權。起始點是以確定性方式選取，因此同一張影像永遠會得到相同的調色盤。
顏色是從瀏覽器用於顯示的 sRGB 空間讀取。若影像內嵌廣色域色彩設定檔，數值可能會與相片編輯器顯示的略有不同。在支援的瀏覽器中（桌上型電腦的 Chrome 和 Edge），「從螢幕挑選」按鈕會使用內建的 EyeDropper 從螢幕上任何位置取色。
範例
比對品牌顏色
上傳標誌的螢幕截圖，點擊其主要顏色，然後將 #1a73e8 或 rgb(26, 115, 232) 複製到您的 CSS 中。
從照片建立調色盤
將海灘照片分為 6 種顏色，可得到沙灘、海洋和天空色調，每種顏色都會顯示在影像中所佔的比例，由大至小排序。
檢查色調
使用放大鏡拉近，即可選取細線條的確切像素，而不是旁邊的抗鋸齒邊緣。
常見問題
為什麼顏色和我的照片編輯器中的略有不同？
瀏覽器會將影像轉換為 sRGB 以顯示。含有廣色域設定檔（Display P3、Adobe RGB）的照片，在保留原始設定檔的編輯器中可能會顯示略微不同的數值。
為什麼沒有「從螢幕選色」按鈕？
這需要 EyeDropper API，目前只有部分瀏覽器支援，例如桌面版 Chrome 和 Edge。從上傳的圖片中選取顏色則在所有瀏覽器皆可使用。
主要顏色是如何選出的？
透過對所有像素進行 k-means 分群，並以每種顏色出現的頻率加權。小面積但鮮明的細節可能會被併入鄰近較大的顏色；增加顏色數量即可將它們分開。
圖片會上傳嗎？
不會。圖片由此頁面在您的瀏覽器中解碼與分析，絕不會離開您的裝置。
隱私權
圖片完全在您的瀏覽器中處理。圖片不會上傳，選取的顏色也不會被傳送或儲存。