免費顏色工具
提取、分析、轉換並分享您的顏色。12 款專業工具，100% 免費，無需註冊。
圖片色彩選擇器 從任意圖片像素精準拾取HEX RGB HSL色碼
上傳任意圖片，用色彩選擇器在畫布上精準拾取像素顏色，即時讀取HEX、RGB、HSL數值並一鍵複製，全程在瀏覽器本機完成不上傳。
圖片主色提取工具 從圖像一鍵取得HEX RGB主色調配色
從任意圖片智慧提取占比最高的主色調，自動生成協調配色並同步輸出每種顏色的HEX與RGB色碼，圖像在瀏覽器本機解析，無需上傳。
圖片調色盤生成器 上傳圖像自動生成完整HEX RGB配色方案
上傳一張圖片即可智慧生成完整調色盤，自動提取和諧配色並顯示每種顏色的HEX、RGB色碼，全部在瀏覽器本機處理，方便直接取用。
圖像主色調辨識工具 提取畫面主要顏色與占比及HEX數值
分析圖像並辨識占比最高的幾種主導顏色及各自比例，輸出對應的HEX與RGB數值，幫助你快速理解畫面並沿用其整體配色風格。
相似顏色查找器 匹配鄰近色調並輸出HEX RGB相近色值
輸入任意顏色即可查找視覺上鄰近的相似色系，附帶每個色值的HEX、RGB數值，幫你輕鬆擴充並微調整套配色方案的層次。
顏色格式轉換器 HEX RGB HSL CMYK OKLCH色值一鍵互轉
在HEX、RGB、HSL、CMYK、OKLCH等格式之間即時互相轉換顏色，即時預覽色塊並複製色碼，方便設計排版與前端開發直接使用。
顏色對比度檢測器 檢查WCAG無障礙對比度AA AAA是否合規
檢查前景與背景色的WCAG對比度比值，自動判定AA與AAA等級是否達標，確保內文與標題文字清晰可讀並符合無障礙設計標準。
調色盤匯出工具 將配色一鍵輸出為CSS JSON ASE格式檔案
把整套調色盤一鍵匯出為CSS、JSON、ASE等多種格式檔案，便於匯入Figma等設計軟體或直接接入前端專案開發流程。
顏色預覽工具 即時檢視配色套用在真實設計版面中的效果
把選定顏色套用到真實版面與元件中即時預覽效果，直觀比較多組配色之間的差異，幫你在正式落地前做出更穩妥的配色決定。
調色盤下載工具 將HEX配色匯出為PNG圖像檔案儲存分享
將整套調色盤連同每個色塊的HEX色碼下載為清晰的PNG圖片，方便隨時分享、存檔或加入設計交付說明文件中長期保存。
配色方案分享工具 透過專屬連結一鍵分享調色盤便於協作
生成專屬連結即可一鍵分享你的調色盤，對方無需安裝任何軟體便可直接檢視完整配色與HEX數值，讓團隊協作溝通更順暢高效。
色彩和諧搭配工具 生成互補三元分裂類比等和諧配色方案
基於色輪生成互補色、三元色、分裂互補、類比等多種和諧配色方案，並附上每種顏色的HEX數值，幫你快速找到協調耐看的組合。
CSS漸層生成器 視覺化製作線性徑向漸層並一鍵複製色碼
視覺化調整顏色、位置與角度，生成線性或徑向CSS漸層並一鍵複製程式碼，即時預覽效果，便於直接用於網頁背景與按鈕樣式。
網格漸層生成器 製作多彩Mesh漸層背景並匯出CSS程式碼
建立柔和的多彩網格漸層背景，自由拖動色點位置調節色彩層次並匯出CSS程式碼，為介面與首屏增添富有現代感的視覺質感。
動態漸層生成器 製作流動CSS漸層動效背景並匯出程式碼
生成平滑流動的動態漸層背景，可自由調節顏色、方向與速度並匯出CSS程式碼，讓網頁首屏、橫幅與按鈕更具動感與活力。
色盲模擬器 檢測配色在紅綠藍黃等色覺障礙下的顯示效果
模擬紅綠色盲、藍黃色盲等多種色覺障礙下的畫面效果，檢驗配色的可辨識度，幫助你打造更具無障礙包容性的介面視覺設計。
文字可讀性測試工具 檢測文字與背景配色組合的清晰程度
測試不同文字與背景顏色組合的實際可讀性，結合對比度比值評估清晰程度，助你為內文與標題選出真正易讀又舒適的配色。
WCAG分析器 逐一檢測整套調色盤的無障礙對比度合規性
逐一分析調色盤中各顏色組合的WCAG對比度，清晰標註AA、AAA達標情況，幫你全面掌控整站配色的無障礙合規水平。
玻璃擬態生成器 製作毛玻璃模糊透明CSS效果並複製程式碼
視覺化調節模糊、透明度與背景顏色，生成玻璃擬態毛玻璃CSS效果並一鍵複製程式碼，直接用於現代卡片、導覽與彈窗介面。
新擬態生成器 製作柔和UI凹凸陰影CSS效果並即時預覽
調節光影方向、圓角與顏色生成新擬態柔和凹凸UI效果，即時預覽並匯出CSS程式碼，為按鈕與卡片打造細膩立體的介面質感。
彩色陰影生成器 製作多層彩色投影CSS程式碼並即時預覽
為按鈕與卡片元素生成富有層次的彩色投影，自由搭配顏色、模糊與偏移並匯出CSS程式碼，讓介面視覺更加立體生動有質感。
雙色調效果生成器 為圖片套用雙色漸層濾鏡打造統一風格
為圖片套用雙色調漸層效果，自選高光與陰影兩種顏色打造統一而醒目的視覺風格，圖像全程在瀏覽器本機處理，不會上傳。
圖片顏色濾鏡工具 調整色調飽和度亮度與色溫並即時預覽
為圖片套用顏色濾鏡，即時調整色調、飽和度、亮度與色溫並即時預覽效果，圖像全程在瀏覽器本機處理，不會上傳伺服器。
色彩情緒板製作工具 用你的調色盤搭建視覺參考與靈感板
用你的調色盤搭建視覺情緒板，自由組合顏色、紋理與靈感素材，為品牌與設計專案確定統一而清晰的整體視覺基調與方向。
顏色混合器 調配兩種或多種顏色生成平滑的中間過渡色值
混合兩種或多種顏色生成平滑的中間過渡色，即時讀取每一步的HEX、RGB數值，幫你輕鬆調配出理想的中間色調與漸層。
明暗色階生成器 生成任意顏色的深淺明暗變體與色階方案
為任意基礎色一鍵生成整套明色與暗色階變體，並附上每一級的HEX數值，便於建構層次分明又統一協調的完整配色體系。
隨機調色盤生成器 一鍵重新整理取得和諧配色的靈感方案
一鍵生成隨機而和諧的調色盤，快速激發配色靈感，每一組均附上HEX色碼，可反覆重新整理直到找到令你真正滿意的方案。
關鍵字配色生成器 輸入詞語智慧生成主題調色盤配色方案
輸入海洋、日落、森林等關鍵字，即可智慧生成契合主題氛圍的調色盤並附上HEX色碼，讓整套配色緊貼你的創意概念與構思。
Tailwind調色盤生成器 輸出CSS完整色階配置程式碼
根據一個基礎色生成完整的Tailwind CSS色階配置，從最淺到最深一應俱全，可直接複製到設定檔加速主題搭建與開發。
CSS變數匯出工具 將配色生成自訂屬性程式碼便於複用
將整套調色盤匯出為CSS自訂屬性變數，一鍵複製貼上即可在樣式表中集中管理並複用專案的主題配色，方便團隊統一維護。
shadcn/ui主題生成器 輸出元件庫明暗模式配色變數程式碼
為shadcn/ui生成完整的主題配色變數，涵蓋明亮與暗色兩種模式，一鍵複製程式碼即可直接套用到你的元件庫專案中。
SCSS變數匯出工具 將配色生成Sass變數程式碼便於複用
將整套調色盤匯出為SCSS/Sass變數，一鍵複製即可在樣式檔中集中管理與複用專案配色，方便團隊統一維護與調整。
色溫分析工具 判斷顏色的冷暖傾向並給出對應的色溫數值
分析任意顏色的冷暖傾向並給出對應的色溫數值，幫助你在整套配色中平衡溫度感，為畫面營造出理想的氛圍與整體情緒基調。
色彩情緒分析工具 解讀顏色所傳達的情感與心理學深層含義
探索每種顏色所傳達的情感與心理聯想，解讀不同色調背後的氛圍特質，助你為品牌與專案挑選恰當而貼切的整體主題配色。
品牌色提取工具 從Logo標誌中提取HEX RGB品牌配色
在目錄中搜尋品牌，查看已收錄的品牌色彩，並快速複製可用的 HEX 色碼。
流行色彩趨勢工具 發現當下熱門配色與調色盤的靈感來源
瀏覽當下流行的熱門顏色與調色盤趨勢，每一組均附上HEX色碼方便隨手取用靈感，讓你的設計始終緊跟最新的視覺潮流。
漸層映射工具 依圖片明度用自訂漸層為整個畫面重新上色
根據圖片像素明度套用漸層映射，用你自訂的漸層為整個畫面重新上色打造風格化影調，圖像全程在瀏覽器本機處理不上傳。
顏色疊加工具 為圖片加上半透明色彩濾層統一整體畫面色調
為圖片疊加半透明色彩濾層並調節混合模式，統一整體畫面色調、營造特定氛圍，圖像全程在瀏覽器本機處理，不會上傳伺服器。
單色配色生成器 生成同一色系深淺明暗漸層過渡配色方案
基於單一色相生成同色系的深淺明暗配色方案，並附上每一級的HEX數值，幫你打造簡潔統一又富有層次的視覺風格與配色。
互補配色生成器 生成對比強烈且格外醒目的撞色配色方案
基於色輪生成對比鮮明的互補撞色方案並附上HEX色碼，幫你打造視覺衝擊力強、重點突出且格外醒目的高對比配色搭配。
UI配色預覽工具 在真實介面元件中檢視配色的實際效果
把配色套用到按鈕、卡片、表單等真實UI元件上即時預覽，直觀檢驗介面整體效果，讓你在正式落地前及早發現潛在問題。
社群媒體配色預覽工具 在貼文與封面模型中檢視配色效果
在社群媒體貼文與封面模型中預覽你的配色效果，直觀評估配色在動態消息中的實際視覺表現，幫你優化內容在各平台的呈現。
面向設計師和開發者的專業顏色工具
我們的顏色工具套件讓您能夠從圖像中提取調色盤，在各種格式（HEX、RGB、HSL、CMYK）之間轉換，檢查 WCAG 無障礙性，並將顏色匯出為 CSS、Sass 或 Tailwind。所有工具都直接在您的瀏覽器中執行，無需註冊並尊重您的隱私。
從圖像中提取和分析顏色
使用我們的顏色選擇器（吸管）精確識別照片中的任何顏色。自動提取主要顏色，並從您的靈感圖像中生成和諧的調色盤。非常適合品牌設計、網頁設計和平面創作。
顏色轉換與無障礙性
在 HEX、RGB、HSL 和 CMYK 之間即時轉換您的顏色。根據 WCAG AA 和 AAA 標準檢查顏色之間的對比度，以確保設計的無障礙性。基於色輪生成顏色和諧：互補色、類似色、三色等。
100% 免費、無需註冊、保護隱私
我們所有的顏色工具都完全免費，無需註冊。您的圖像和資料在瀏覽器中本地處理，絕不會傳送到我們的伺服器。請放心地將我們的工具用於您的個人和專業專案。