色碼轉換器
輸入 HEX、RGB 或 HSL 任一格式的色碼，即時轉換為其他格式並預覽顏色。
使用說明
- 在 HEX、RGB 或 HSL 任一欄位輸入色碼，其他格式會即時自動轉換。
- HEX 支援 3 位（#RGB）和 6 位（#RRGGBB）兩種格式。
- 點擊色碼旁的「複製」按鈕，即可將該格式的色碼複製到剪貼簿。
- 點擊下方「常用顏色」的色塊，可快速選擇預設顏色。
- 上方的大色塊會即時預覽當前選中的顏色。
色碼格式說明
| 格式 | 範例 | 說明 |
|---|---|---|
| HEX | #3B82F6 | 16 進位色碼，常用於 CSS 和設計工具。# 後接 6 位（RRGGBB）或 3 位（RGB）16 進位數字。 |
| RGB | rgb(59, 130, 246) | 紅綠藍三原色，各通道數值 0-255。常用於 CSS 和程式開發。 |
| HSL | hsl(217, 91%, 60%) | 色相(H: 0-360°)、飽和度(S: 0-100%)、亮度(L: 0-100%)。更直覺的色彩描述方式。 |
常見問題 FAQ
什麼是 HEX 色碼？
HEX 色碼是一種用 16 進位數字表示顏色的方式，格式為 #RRGGBB，其中 RR、GG、BB 分別代表紅、綠、藍三個通道的數值（00-FF）。例如 #FF0000 代表純紅色、#00FF00 代表純綠色。也可使用 3 位縮寫，如 #F00 等同於 #FF0000。
RGB 和 HEX 有什麼差別？
RGB 和 HEX 都是基於紅綠藍三原色的表示法，本質上是相同的。差別在於 RGB 使用 10 進位數字（0-255），而 HEX 使用 16 進位數字（00-FF）。例如 rgb(255, 0, 0) 和 #FF0000 都代表純紅色。CSS 中兩種格式都可以使用。
HSL 和 RGB 有什麼不同？什麼時候用 HSL 比較好？
HSL 用色相（Hue）、飽和度（Saturation）、亮度（Lightness）來描述顏色，比 RGB 更直覺。想要「同色系但更淡」只需調高 L 值，「同色系但更鮮豔」只需調高 S 值。在設計配色方案、製作漸層效果時，HSL 會比 RGB 更容易操作。
轉換後的數值會有誤差嗎？
RGB 和 HEX 之間的轉換是無損的。但 HSL 轉換因為涉及浮點數運算和四捨五入，可能會有 1-2 個單位的誤差。這在視覺上幾乎看不出差異，不影響實際使用。
可以輸入透明度（Alpha）嗎？
目前本工具僅支援不透明的顏色轉換（不含 Alpha 通道）。如需使用透明度，可在轉換後手動添加 Alpha 值，例如將 #FF0000 改為 #FF000080（50% 透明），或將 rgb(255,0,0) 改為 rgba(255,0,0,0.5)。