色彩轉換器

為什麼需要色彩轉換器？

在數位設計的世界裡，不同的領域說著不同的「顏色語言」。

• 網頁工程師 習慣用簡短的 HEX (#FF5733)。

• 軟體開發者 可能需要 RGB (255, 87, 51) 來進行運算。

• 平面設計師 為了印刷需求，必須看 CMYK 數值。

• UI 設計師 為了調整亮暗，更喜歡用 HSL。

當您拿到一個色碼，卻發現它不是您需要的格式時，這款 色彩轉換器 就是您的救星。它能瞬間將顏色「翻譯」成所有常見的格式，確保色彩在不同媒介上的一致性。

常見色彩模式解讀

了解這些代碼代表什麼，能幫助您更專業地使用它們：

1. HEX (十六進位)： 網頁最常用。由 # 加上 6 個字元組成，每兩個字元分別代表紅、綠、藍的強度。

2. RGB (紅綠藍)： 螢幕顯示標準。光的三原色，數值範圍 0-255。

3. HSL (色相/飽和度/亮度)： 最符合人類直覺。

   • 想把顏色變亮？直接調整 L (Lightness)。

   • 想讓顏色變鮮豔？直接調整 S (Saturation)。

   • 比調整 HEX 碼直覺太多了。

4. CMYK (印刷四分色)： 顏料的顏色。包含青、洋紅、黃、黑。

常見的應用場景

1. CSS 透明度設定 (HEX to RGBA)

標準的 HEX (#000000) 是不帶透明度的。

• 如果您想在 CSS 中設定「半透明的黑色背景」。

• 您需要將其轉換為 rgba(0, 0, 0, 0.5)。本工具能幫您快速算出正確的 RGB 數值。

2. 平面與網頁的轉換

當您要把 LOGO 印在名片上時，不能直接用網頁的 RGB 色碼（印出來會色偏）。

• 您需要轉換為 CMYK 格式，以確保印刷成品的顏色與螢幕上看到的接近。

3. 建立配色系統 (Design System)

在設計 UI Guideline 時，通常需要同時列出 HEX 與 RGB 數值，方便 iOS (使用 RGB) 與 Web (使用 HEX) 的開發團隊使用。

常見問題 (People Also Ask)

Q1：為什麼 RGB 轉 CMYK 後顏色變髒了？

這是正常的物理現象。

• RGB (螢幕) 是發光體，色域很廣，能顯示非常鮮豔的螢光色。

• CMYK (印刷) 是油墨反射，色域較窄。

• 很多螢幕上亮麗的顏色（如螢光綠），印刷就是印不出來，轉換時會被自動調整為「最接近但較暗」的顏色。

Q2：HEX 碼可以是 3 碼嗎？

可以，那是簡寫。

• #F00 等同於 #FF0000。

• 只有當每兩位數字都相同時 (如 AA, BB, CC) 才能簡寫。本工具會自動幫您處理這種轉換。

Q3：HSL 和 HSV (HSB) 一樣嗎？

不一樣，雖然很像。

• 兩者的 H (色相) 定義相同。

• HSL (L=Lightness)： 100% 亮度是純白。

• HSV (V=Value)： 100% 明度只是該顏色最亮的狀態（不一定是白）。

• CSS 標準使用的是 HSL。

Q4：Alpha Channel 是什麼？

這代表**「不透明度」**。

• 在 rgba(255, 0, 0, 0.5) 中，最後的 0.5 就是 Alpha 值。

• 0 代表完全透明（看不見），1 代表完全不透明。