Color Picker

← ToolBox / 取色器
📖 檢視「顏色選擇器使用指南」

🎨 Color Picker

Color Picker is available directly in your browser, with no data uploaded.

#4151E1
主色
RGB、HEX、HSL 均可直接輸入

📜 歷史記錄

🎯 預設色板

📊 顏色分析

🎨 配色建議

基於當前顏色生成互補、相鄰與三角色，點選色塊即可繼續編輯。

♿ 文字可讀性（WCAG）

以當前顏色和背景色計算對比度；可調整背景色以檢查實際介面。

⚠️ 使用說明與注意事項

📚 深度解析：取色器

💡 常見使用場景

格式互轉
吸取某點得到 RGB(52,152,219)，等價 HEX #3498db、HSL(204°,68%,53%)。同一顏色在不同色彩空間數值不同，但指向同一畫素。
拾色注意
螢幕為 sRGB，不同裝置有色差；印刷需轉 CMYK，螢幕取的 HEX 直接印可能偏色。

❓ 常見問題（FAQ）

HEX 和 RGB 哪個更準？
表示同一顏色，無精度差異。HEX 是 RGB 的十六進位制寫法，前端 CSS 兩者都接受；設計協作常用 HEX，程式碼裡 RGB/RGBA 便於控制透明度。
取色後和原圖看起來不一樣？
可能是色彩配置（sRGB/Display P3）或顯示器校色差異；以目標輸出裝置的色彩空間為準。

🔗 相關工具

🎨 CSS動畫生成器（關鍵幀視覺化） - 免費線上工具，純前端處理 | ToolBox免費線上工具箱CSS動畫生成器（關鍵幀視覺化） 🎼 Web Audio 節拍器 - 免費生成器工具，線上節拍器 | ToolBox免費線上工具箱線上節拍器 🎨 二維碼生成器（已有，可加強定製） - 免費線上工具，純前端處理 | ToolBox免費線上工具箱二維碼生成器（已有，可加強定製） 🎨 條形碼生成器（EAN-13等） - 免費線上工具，純前端處理 | ToolBox免費線上工具箱條形碼生成器（EAN-13等） 🎨 盒子陰影生成器（視覺化調整） - 免費線上工具，純前端處理 | ToolBox免費線上工具箱盒子陰影生成器（視覺化調整）
📖關於「顏色選擇器」 ▼

📝工具簡介

免費線上顏色選擇器，支援RGB/HEX/HSL顏色格式互轉，螢幕取色，調色盤，顏色搭配推薦。設計創意工具，視覺化操作，一鍵生成 CSS 程式碼。

✨功能特點

🎯使用場景

💬常見問題

這個工具是免費的嗎？
完全免費，無需註冊，直接在瀏覽器中使用。
生成的程式碼可以直接用嗎？
可以，生成的 CSS 程式碼符合標準，可直接複製到專案中使用。
支援自定義引數嗎？
支援，提供多種引數調節選項，滿足個性化設計需求。