如何使用
- 點擊「選擇圖片」、拖曳輸入圖片，或直接按 Ctrl+V / Cmd+V 貼上截圖。
- 在圖片上移動鼠標或手指，查看實時 HEX、RGB、HSL 顏色值和放大鏡預覽。
- 點擊想保留的位置，顏色會進入取色歷史。
- 點擊「提取主色調」，生成圖片調色板，並複製需要的色值。
示例場景：把產品截圖貼上進工具，吸取按鈕主色，複製 HEX 到 CSS 或設計稿中。
核心功能
- 本機圖片取色：圖片只在瀏覽器 Canvas 中渲染和讀取像素，不會上傳到伺服器。
- 像素級 HEX/RGB/HSL：移動鼠標或拖動手指，即時查看當前像素的 HEX、RGB 和 HSL 顏色值。
- 放大鏡準星輔助：局部放大預覽幫助你對準圖示邊緣、UI 截圖細節和細小色塊。
- 圖片調色板生成：在瀏覽器內統計圖片像素，提取最多 5 個適合設計參考的主色調。
- 點擊保存與複製：點擊圖片保存取色歷史，點擊色塊即可複製顏色代碼。
相關工具
2026 最新 FIRE 財務自由計算機(剔除通膨版)。拒絕虛高數字，精準模擬實際購買力下的複利增長。支援 4% 法則驗證與退休金缺口反向推算。支援一鍵匯出 CSV，完美適配 Excel 或 Notion 財務看板。隱私優先，本機計算零上傳。
根據帳戶資金、風險比例、進場價和停損價計算交易倉位。所有計算在瀏覽器本機完成，不上傳帳戶資料，可對比多檔風險方案。
輸入本金、定期投入、年化報酬率和投資年限，計算複利增長結果，並用互動式圖表展示本金、利息和最終總額。資料僅在本機計算。
使用 Loan Calculator／Mortgage Calculator 在瀏覽器本機計算每月還款額、總利息與還款明細。輸入貸款金額、年利率和期限，立即查看圖表與還款計畫表。
使用 Investment Calculator／ROI Calculator 在瀏覽器本機估算初始本金、每月定期定額、年化報酬率和通膨後的投資結果。立即查看複利圖表、本金／收益拆解、ROI 與年度明細。
使用 APR to APY Calculator 在瀏覽器本機完成 APR/APY 雙向換算。輸入利率並選擇複利頻率，立即查看有效年利率、差值和多頻率比較表。
使用這款利潤率計算機在瀏覽器本機計算毛利、Margin 和 Markup。輸入成本和售價，或輸入成本與目標毛利率，立即推算售價並避免把加成率誤當利潤率。
使用 CPM 與 CPC 計算機在瀏覽器本機試算廣告花費、曝光數、點擊數、CPM、CPC 和 CTR。輸入預算與目標成本，快速推演可獲得的曝光或點擊。
計算邏輯
本工具使用 HTML5 Canvas 在瀏覽器本機解碼圖片，並通過 getImageData 讀取取色坐標處的 RGBA 像素值。HEX、RGB 和 HSL 都由這個像素值即時換算得到。
主色調提取會按一定步長採樣 Canvas 像素，將相近顏色歸入同一色桶，再按出現次數排序輸出前 5 個顏色。這個結果適合快速生成網頁和設計參考色板，但不承諾還原專業攝影工作流中的 ICC / P3 絕對色彩管理。
常見問題
圖片會上傳到伺服器嗎？
不會。圖片讀取、取色、放大鏡預覽和調色板生成都在你的瀏覽器本機完成。
如何從圖片中獲取 HEX 顏色？
選擇或貼上圖片後，把鼠標或手指移動到目標位置，當前顏色會實時顯示。點擊圖片即可把顏色保存到歷史記錄，再點擊色塊複製 HEX。
支援哪些顏色格式？
工具顯示並複製 HEX、RGB 和 HSL，覆蓋網頁設計和前端開發最常用的顏色格式。
爲什麼和 Photoshop 裏的顏色可能有差異？
瀏覽器 Canvas 讀取的是圖片在瀏覽器中實際渲染後的像素。不同瀏覽器、顯示器色域和圖片內嵌色彩配置檔案可能造成輕微差異。
行動裝置上可以取色嗎？
可以。在移動設備上，你可以用手指在圖片上拖動準星，鬆開或點擊即可鎖定顏色。