顏色轉換

在 HEX、RGB 和 HSL 之間轉換，並檢查對比度。單向的 HEX 轉 RGB 仍在 HEX 轉 RGB

這一頁做什麼

同一種顏色可以寫成 HEX、RGB 或 HSL。這一頁讓三種寫法保持同步，並對照第二種 HEX 檢查對比度。單向的 HEX 轉 RGB 仍在 HEX 轉 RGB。

怎麼用

  1. 輸入 HEX，或 R、G、B，或 H、S、L。其餘欄位和色塊會隨輸入更新。沒有轉換按鈕。
  2. 對比色是用來算對比度的第二種 HEX。
  3. 顯示範例把對比色設為 #e8f0f6，HEX 設為 #112233。R 是 17，G 是 34，B 是 51。H 是 210，S 是 50，L 是 13。比值是 14.02:1。正文 AA、AAA 和大字 AA 都通過。
  4. 全部清除清空所有欄位、色塊和比值。

規則和邊界

#RGB 會把每位數字重複一次，所以 #123 是 #112233。不是 3 位或 6 位十六進位會報錯。H 是 0 到 360，S 和 L 是 0 到 100，R、G、B 是 0 到 255。對比度用 WCAG 相對亮度。正文 AA 是 4.5:1，AAA 是 7:1，大字 AA 是 3:1。對比色為空時不顯示比值。

用在哪

  • 把一種深色 HEX 轉成 HSL。
  • 看深藍在淺底上的對比度。
  • 把同一種顏色讀成 17、34、51。

常見問題

這一頁轉換 HSB、HWB 或 CMYK 嗎？

不轉換。它轉換 HEX、RGB 和 HSL，並顯示對比度。

為什麼三項都通過？

14.02:1 高於 7，所以 #112233 放在 #e8f0f6 上時，正文 AA、AAA 和大字 AA 都通過。