顏色代碼轉換器
HEX
#3b82f6RGB
rgb(59, 130, 246)HSL
hsl(217, 91%, 60%)OKLCH
oklch(0.623 0.188 259.8)HSL Adjustment
Contrast Ratio (WCAG)
Compare color:
샘플 텍스트
Contrast ratio: 3.68:1
WCAG: AA Large
最後更新：2026 · 免費線上工具
什麼是 顏色代碼轉換器？
免費線上顏色轉換工具，可在HEX、RGB、HSL、OKLCH色彩代碼間即時互轉，並計算兩種顏色的WCAG對比度以檢查無障礙合規性。 適用於開發與資料處理時需要在 CSV、JSON、色彩、時間等不同格式之間轉換的情況，全部在瀏覽器本機完成，輸入資料不會上傳伺服器，無需安裝或註冊即可免費使用。 結果可一鍵複製，整個過程簡單快捷，無需下載任何軟體，在手機和電腦上都能隨時流暢使用。
使用方法
- 1輸入顏色— 使用取色器或文字輸入顏色。支援HEX、rgb()、hsl()格式。
- 2查看格式— HEX、RGB、HSL、OKLCH格式同時顯示。
- 3複製值— 點擊每種格式的複製按鈕複製CSS值。
- 4檢查對比度— 設定對比顏色以檢查WCAG對比度。
相關工具
時間戳轉換器免費線上工具，在Unix時間戳與日期之間雙向轉換，可識別秒(10位)和毫秒(13位)，支援KST、JST、UTC等時區以及ISO 8601和相對時間。 適用於開發與資料處理時需要在 CSV、JSON、色彩、時間等不同格式之間轉換的情況，全部在瀏覽器本機完成，輸入資料不會上傳伺服器，無需安裝或註冊即可免費使用。
CSS 漸層產生器免費線上視覺化工具，設計linear、radial、conic漸層，調整顏色停止點和角度，一鍵複製網頁背景的CSS程式碼。 適合在測試與開發中即時產生所需數值，所有產生過程都在瀏覽器本機執行，資料不會上傳伺服器，無需安裝或註冊即可免費使用。 結果可一鍵複製，整個過程簡單快捷，無需下載任何軟體，在手機和電腦上都能隨時流暢使用。
CSS 盒子陰影產生器免費線上CSS box-shadow產生器，可調節偏移、模糊、擴散、顏色和內陰影inset並即時預覽陰影，產生可複製的box-shadow CSS代碼。 適合在測試與開發中即時產生所需數值，所有產生過程都在瀏覽器本機執行，資料不會上傳伺服器，無需安裝或註冊即可免費使用。 結果可一鍵複製，整個過程簡單快捷，無需下載任何軟體，在手機和電腦上都能隨時流暢使用。
常見問題
OKLCH是Oklab色彩空間的圓柱形表示，是感知最均勻的色彩空間。CSS Color Level 4已支援。
衡量文字與背景顏色之間的亮度差異。AA標準要求至少4.5:1，AAA標準要求7:1。
目前僅支援不透明顏色（RGB、6位HEX）。RGBA和HSLA將在未來版本中新增。
可以。每種格式的輸出值可以直接貼到CSS中使用。
不會。所有顏色轉換都在瀏覽器中完成。