🎨

Image Color Picker

Click an image to identify HEX and RGB colors

Click anywhere on the image to pick a color.

Selected color
—
—

Image Color Picker — what it does

Load an image, click anywhere on it, and read the exact colour under the cursor as HEX and RGB. It is an eyedropper for pixels you can see but cannot access — a colour in a screenshot, a shade in a photograph, a tone from a design someone sent as a flattened image.

When this tool helps

  • Matching a website's colours from a screenshot when you have no access to its CSS.
  • Sampling a colour from a photograph to use as a background or accent in a layout.
  • Reading brand colours out of a supplied image when no specification came with it.

How to use it

  1. Choose the image.
  2. Click anywhere on it to sample that pixel.
  3. Read the HEX and RGB values.
  4. Copy the value into your design or code.

Accuracy, limits, and good practice

  • Sample from a flat area rather than an edge; anti-aliased boundaries blend two colours and give a value that exists in neither.
  • JPEG artefacts vary colour slightly across a region that looks uniform — sample a few points and take the most consistent value.
  • Screenshots taken with colour management or filters applied may not match the source's true colour values.

Frequently asked questions

Can I pick an average colour for an area?

This samples a single pixel. For the dominant colours across the whole image, use the colour palette extractor.

Why does the same colour look different elsewhere?

Display profiles and surrounding colours change perception. The numeric value is the reliable reference, not the appearance.

Does it work on transparent images?

Sampling a transparent pixel gives the colour composited against the page background rather than a meaningful source value.

Related tools on this site

Everything above runs inside this page. Image Color Picker needs no account, no upload, and no server round trip — close the tab and nothing is left behind.

圖片取色器能做什麼

載入圖片、在任意位置點一下,即可讀到游標下那個像素的 HEX 與 RGB 值。它是為「看得到卻取不到」的像素準備的滴管——截圖裡的顏色、照片中的色調,或別人只給了平面圖檔的設計配色。

什麼時候用得上

  • 拿不到網站 CSS 時,從截圖比對出它的顏色。
  • 從照片取樣顏色,作為版面的背景或重點色。
  • 對方只給了圖片、沒附規範時,從中讀出品牌色。

使用步驟

  1. 選擇圖片。
  2. 在任意位置點擊取樣該像素。
  3. 讀取 HEX 與 RGB 值。
  4. 把數值複製到設計或程式中。

精確度、限制與實務建議

  • 請取平整區域而非邊緣;抗鋸齒邊界混合了兩種顏色,取到的值兩邊都不是。
  • JPEG 壓縮痕跡會讓看似均勻的區域顏色略有差異——多取幾點,採最一致的值。
  • 套用色彩管理或濾鏡後截的圖,可能與來源的真實色值不同。

常見問題

可以取一個區域的平均色嗎?

此工具取單一像素。要取整張圖的主要顏色,請用配色提取工具。

為什麼同一個顏色在別處看起來不同?

螢幕色彩描述檔與周圍顏色會影響感知,可靠的參考是數值,不是外觀。

透明圖片可以取色嗎?

取到透明像素時,得到的是與頁面背景合成後的顏色,並非有意義的來源色值。

本站相關工具

以上步驟全部在這個頁面內完成,圖片取色器 不需要註冊、不上傳檔案、也不經過伺服器,關閉分頁後不會留下任何資料。