點擊導入圖片 /截圖後Ctrl+V粘貼 /拖拽圖片到此處

支持常見圖片格式 jpg/png 等

取色工具

HEX RGB RGBA
{{ (scale * 100).toFixed(0) }}%
{{ formatColor(c) }}
{{ formatColor(hoverColor) }}

🎨 如何從照片中提取顏色?

這是一款功能強大的在線取色工具,讓您輕鬆從圖片、截圖中獲取精確的色彩信息。支持批量取色,讓您的設計工作更高效!

🚀 快速導入圖片的多種方式

  • 📁 點擊導入:點擊上傳區域或側邊欄的「導入圖片」按鈕,選擇本地圖片文件
  • 📋 截圖粘貼:截圖後直接按 Ctrl+V 粘貼,極速取色體驗!
  • 🖱️ 拖拽導入:直接將圖片文件拖拽到頁面中即可自動識別

💡 小貼士:支持 JPG、PNG 等常見圖片格式,截圖粘貼是最快的取色方式哦!

🔍 精準取色操作

  • 👆 點擊取色:鼠標移動到圖片上,點擊任意位置即可拾取該點的顏色
  • 🔎 放大鏡預覽:鼠標懸停時顯示 9x9 像素網格,精確觀察像素細節
  • 🎯 實時預覽:懸停位置顯示當前顏色的 HEX/RGB/RGBA 值

🖼️ 圖片瀏覽控制

  • 🔍 縮放圖片:使用鼠標滾輪或側邊欄滑塊調整縮放比例(10%-500%)
  • ✋ 移動圖片:按住空格鍵 + 鼠標拖動,或直接在圖片上拖動來移動視圖
  • 🔄 重置視圖:點擊右上角的重置按鈕,快速恢復到初始狀態

📊 批量取色技巧

  • 🎨 多次點擊:在圖片不同位置連續點擊,收集多個顏色到右側面板
  • 📋 單個複製:點擊任意顏色條目,即可複製該色值到剪貼板
  • 📑 批量複製:點擊「複製全部」按鈕,一次性複製所有收集的色值(每行一個)
  • 🗑️ 清空列表:點擊刪除按鈕清空所有已收集的顏色

💡 專業技巧:批量取色適合提取配色方案、分析圖片色彩構成,大幅提升設計效率!

⚙️ 顏色格式設置

  • HEX:十六進制格式,如 #FF5733(網頁設計常用)
  • RGB:紅綠藍三原色,如 rgb(255, 87, 51)
  • RGBA:帶透明度的 RGB,如 rgba(255, 87, 51, 1.00)

✨ 特色功能亮點

  • ✅ 純瀏覽器處理,保護隱私,圖片不會上傳到服務器
  • ✅ 實時響應,毫秒級取色速度
  • ✅ 支持透明圖片,棋盤格背景輔助查看
  • ✅ 毛玻璃UI設計,現代化交互體驗
  • ✅ 響應式佈局,適配各種屏幕尺寸

🎉 開始您的取色之旅吧! 導入一張圖片,體驗極致的取色快感~