從圖片中取色
選擇圖片像素,複製 HEX、RGB、HSL 或 CSS 顏色變量。
- 免費
- 無需登錄
- 本地處理
使用方法
選擇設備上的文件、拖入文件,或粘貼圖片。
懸停預覽顏色,點擊儲存。使用鍵盤時,方向鍵移動(按住 Shift 每次 10 像素),Enter 儲存。
下載結果或複製顏色,無需註冊或付費。
適用情況
品牌顏色
從 Logo 或產品相片中找出準確的 HEX 色碼,保持設計一致。
從靈感圖建立配色
擷取相片或藝術作品的主色調,作為配色方案的起點。
由設計到程式碼
將顏色複製為 CSS 變數或 Tailwind 設定片段,直接貼入項目。
效果與限制
在圖片上選點,查看包含透明度的網頁顏色。放大預覽有助於選擇小細節。最多保存 10 個不同顏色,可複製單個色值或下載 CSS 變量文本。色值來自瀏覽器解碼後的圖片,不代表經過校準的印刷顏色測量。
輸入和輸出均受大小限制,不支持動畫圖片。文件僅保存在內存,刷新會清空。手機上建議使用較小批次。

常見問題
如何取得圖片中某種顏色的 HEX 色碼?
上載圖片後,將滑鼠移到任何像素上即可在放大鏡中預覽,點擊即可儲存。HEX、RGB、HSL 及 OKLCH 色值會顯示在圖片旁邊,點擊色值即可複製。
主色調是如何找出來的?
工具會對縮小後的圖片副本取樣,以中位切割(median-cut)演算法將相近顏色分組,並按其在圖片中所佔面積排序。透明像素不會計算在內。
可以擷取圖片以外的顏色嗎?
在 Chrome、Edge 等支援 EyeDropper API 的瀏覽器中,使用「從螢幕取色」即可擷取螢幕上任何像素的顏色。
為甚麼顏色與設計檔案略有不同?
使用 Display P3 等廣色域色彩設定檔的圖片,會轉換成網頁通用的 sRGB。色值與瀏覽器顯示一致,但可能與印刷或設計軟件中原有設定檔的效果不同。
圖片會被上傳嗎?
不會。圖片處理在瀏覽器本地完成,文件不會發送給 Codia。刷新或離開頁面後工作區會清空。獲准採集的網站統計不包含圖片內容和文件名。
支持批量處理嗎?
每次處理一張 JPG、PNG 或 WebP,最大 20 MiB、1200 萬像素。
畫質和元數據會保留嗎?
取決於操作和設置。有損壓縮會改變像素,JPG 無法保留透明背景。導出面向普通 8 位網頁圖片,不承諾保留 EXIF、HDR、原始色彩配置或 16 位色深,請檢查處理結果。
相關圖片工具
在線圖片壓縮
縮小 JPG、PNG 和 WebP 的文件大小,保持原始格式。
打開工具 →PNGPNG 圖片壓縮
壓縮 PNG 截圖和圖形素材,保留透明背景。
打開工具 →JPG · PNG · WEBP將圖片壓縮至 100KB
自動調整畫質和尺寸,讓照片滿足上傳大小限制。
打開工具 →WEBP → PNGWebP 轉 PNG
將靜態 WebP 轉為 PNG,保留透明背景。
打開工具 →PNG · WEBP → JPGPNG 轉 JPG
將 PNG 轉為 JPG,並為透明區域選擇背景顏色。
打開工具 →JPG · PNG · WEBP在線調整圖片尺寸
按像素或比例調整圖片尺寸,保持原始寬高比。
打開工具 →SVG → PNGSVG 轉 PNG
將自包含的 SVG 按 1×、2×、4×或自定義寬度導出為 PNG。
打開工具 →