顏色轉換器

在HEX、RGB、HSL、CMYK等不同格式之間轉換顏色。支援顏色選擇、調色板生成和配色方案分析。

顏色選擇器

使用顏色選擇器選擇顏色

顏色格式

目前顏色的各種表示格式

#
rgb(,,)
hsl(,%,%)
hsv(,%,%)
cmyk(%,%,%,%)
oklch(%%)

顏色格式說明

了解不同顏色格式的特點和適用場景

HEX 十六進位

使用 6 位十六進位數字表示顏色,如 #FF5733。這是網頁開發中最常用的顏色格式,相容性最好,適合在 CSS 和 HTML 中使用。

格式:#RRGGBB
範圍:00-FF (0-255)
優點:簡潔、相容性好
缺點:不夠直觀

RGB 紅綠藍

使用紅、綠、藍三個顏色通道的數值來表示顏色,如 rgb(255, 87, 51)。這種格式直觀易懂,適合設計師和開發者理解顏色構成。

格式:rgb(R, G, B)
範圍:0-255
優點:直觀、易理解
缺點:不直觀表示亮度

HSL 色相飽和度亮度

使用色相、飽和度、亮度三個屬性來表示顏色,如 hsl(12, 100%, 60%)。這種格式更接近人類感知顏色的方式,便於調整顏色的明暗和鮮豔程度。

格式:hsl(H, S%, L%)
範圍:H: 0-360°, S/L: 0-100%
優點:直觀、易調整
缺點:不直觀表示亮度

HSV 色相飽和度明度

使用色相、飽和度、明度三個屬性來表示顏色,如 hsv(12, 100%, 100%)。這種格式在圖形軟體中常用,明度值更直觀地表示顏色的亮度。

格式:hsv(H, S%, V%)
範圍:H: 0-360°, S/V: 0-100%
優點:明度直觀、易調整
缺點:在網頁中支援較少

CMYK 青品黃黑

使用青色、品紅色、黃色、黑色四個顏色通道來表示顏色,如 cmyk(0%, 66%, 80%, 0%)。這是印刷業的標準格式,適合需要列印的設計作品。

格式:cmyk(C%, M%, Y%, K%)
範圍:0-100%
優點:印刷標準、專業
缺點:網頁顯示不準確

OKLCH 感知色彩空間

使用感知亮度、色度、色相三個屬性來表示顏色,如 oklch(60% 50% 12)。這是現代色彩空間,更符合人眼感知,支援更廣的色域,適合現代顯示裝置。

格式:oklch(L% C% H)
範圍:L: 0-100%, C: 0-150, H: 0-360°
優點:感知準確、色域廣
缺點:相容性有限

使用建議

  • 網頁開發:優先使用 HEX 和 RGB 格式,相容性最好
  • 設計調整:使用 HSL 格式,便於調整色相和飽和度
  • 專業印刷:使用 CMYK 格式,確保列印效果
  • 現代應用:考慮使用 OKLCH 格式,獲得更好的色彩表現
  • 顏色選擇:使用 HSV 滑塊,直觀地選擇顏色