圖片顏色選擇器
從任意圖片中擷取精確顏色。點擊任意像素即可取得精確的 HEX、RGB 和 HSL 顏色值。非常適合設計師和開發者。
將圖片拖曳至此，或點擊選擇
支援 PNG、JPG、GIF、WebP、BMP
為什麼選擇 圖片顏色選擇器
透過圖像拾色器，您可以上傳任何圖片並透過單擊擷取任何像素的準確顏色。內建像素放大器可以輕鬆定位精確點，即使在複雜的圖像中也是如此。每個拾取的色彩都以十六進位、RGB 和 HSL 格式顯示，並具有一鍵複製、即時色樣預覽以及最近 10 種拾取色彩的历史記錄。一切都在瀏覽器中運行 - 您的圖像永遠不會上傳到伺服器。
- ✓單擊任何像素即可立即擷取其 HEX、RGB 和 HSL 值
- ✓可調節像素放大器 (2x–16x)，用於精確定位
- ✓具有自動文字對比度調整功能的即時顏色預覽樣本
- ✓顏色歷史記錄面板追蹤您最近選擇的 10 種顏色
- ✓每種顏色格式的一鍵複製 - 為 CSS 或設計工具做好準備
- ✓100% 客戶端處理 — 圖像永遠不會離開您的裝置
使用步驟
- 1透過將圖像拖到放置區域或單擊選擇檔案來上傳圖像。
- 2將滑鼠懸停在圖像上可查看光標周圍的放大像素網格。
- 3如果您需要更高或更低的精度，請調整放大器縮放滑塊。
- 4單擊任意像素即可鎖定並擷取其顏色。
- 5在預覽樣本旁邊查看擷取的十六進位、RGB 和 HSL 格式的顏色。
- 6一鍵將任何顏色格式複製到剪貼簿。
- 7瀏覽您的顏色歷史記錄以重新訪問之前選擇的顏色。
常見問題 (FAQ)
顏色選擇器如何從圖像中擷取顏色？
該工具將圖像繪製到 HTML5 Canvas 元素上，然後使用 getImageData() API 讀取您單擊的像素的原始 RGBA 值。這可以直接從圖像位圖中提供準確、無損的顏色數據。
放大鏡是做什麼用的？
放大器會在光標周圍顯示放大的像素網格，使您可以輕鬆定位所需的确切像素 - 即使在詳細或嘈雜的圖像中也是如此。您可以將縮放等級調整為 2 倍到 16 倍。
為什麼有三種顏色格式？
不同的環境需要不同的格式。 HEX 是 CSS 和設計工具的標準。當您需要指定單個通道值或使用 rgba() 實現透明度時，RGB 非常有用。 HSL 是手動調整色調、飽和度或亮度的最直觀格式。
顏色歷史記錄是如何存儲的？
顏色歷史記錄僅保存在瀏覽器會話中 - 它不會保存到硬碟或發送到任何伺服器。只要頁面保持打開狀態，它就會持續存在，並在您關閉或刷新選項卡時被清除。
我可以從透明 PNG 圖像中選取顏色嗎？
是的。該工具讀取原始像素數據，包括 Alpha 通道。對於完全透明的像素，RGB 值反映底層看板背景。對於半透明像素，您可以獲得該像素存儲的 RGB 值。
支持哪些圖像格式？
支持瀏覽器可以呈現的任何格式 - 包括 JPG、PNG、WebP、GIF（第一幀）、BMP 和 SVG。圖像繪製在畫布上，因此瀏覽器支持是唯一的限制。
權威參考資料
相關工具
繼續探索同一情境下的實用工具。