資料不傳送至伺服器 — 所有處理均在瀏覽器中完成
HEX
RGB
HSL
HSV
CMYK
LAB
OKLCH
HSV 僅供參考。CSS 沒有 hsv() 函式 — 請改用 HSL。
CSS 變數
--color-primary: #06d6a0;Tailwind 類別
bg-[#06d6a0]Tailwind v4 @theme
@theme {
--color-primary: oklch(78% 0.16 167);
}顏色轉換器是一款免費的線上工具，用於在 HEX、RGB、HSL、OKLCH 等色彩空間之間轉換。內建視覺化拾色器、圖片調色盤提取、WCAG 對比度檢查及色覺模擬。所有操作完全在瀏覽器中執行。
關於顏色轉換
此顏色工具可在 7 種色彩空間之間轉換、產生調和色、檢查對比度（WCAG 和 APCA）、模擬色覺缺陷，以及從圖片提取調色盤。
色彩空間
HEX — 緊湊的 6/8 位 RGB 表示法。CSS 的預設格式。
RGB — 加法三原色 0–255。直接對應顯示像素。
HSL — 色相/飽和度/亮度。比 RGB 更容易讓人類理解。
HSV — 色相/飽和度/明度。常用於設計工具，但不是 CSS 函式。
CMYK — 印刷用的減法三原色。從 RGB 轉換時為近似值。
LAB — 感知均勻；相等的數值距離 ≈ 相等的視覺距離。
OKLCH — 現代感知色彩空間；Tailwind v4 和 CSS Color Module Level 4 推薦使用。
對比度（WCAG 與 APCA）
WCAG 2.1 使用亮度比率（1:1 到 21:1），設有 AA/AAA 門檻。它被廣泛支援，但未能充分考慮小字或深色模式的感知差異。
APCA 是 WCAG 3 的候選方案，使用極性感知的 Lc 分數。它與細字或小字的易讀性相關性更好。
提示
- 使用拾色器從螢幕上的任何像素取色（僅限 Chromium 瀏覽器）。
- 將圖片拖放到「配色」分頁，透過中位切割量化法提取 6 個主要顏色。
- Tailwind v4 以 OKLCH 輸出顏色以實現感知平滑——複製 @theme 區塊以配合該工作流程。
可以從圖片中提取顏色嗎？
可以。將圖片拖放到調色盤提取區域即可取得主要顏色。還可以模擬色覺缺陷（紅色盲、綠色盲、藍色盲）。