什麼是 Hex 轉 RGB 轉換器?
Hex 色碼是一組六位數的十六進位色彩表示法,寫成 #RRGGBB 的格式。其中每兩位數字代表一個加法混色通道:紅(Red)、綠(Green)、藍(Blue)。這個轉換器會讀取你輸入的 Hex 色碼,並回傳對應的 RGB 三組數值,每個通道都是 0 到 255 之間的整數。RGB 正是 CSS、設計軟體與多數螢幕底層所採用的格式,因此在兩者之間轉換,是網頁工程師與設計師每天都會碰到的工作。
使用方法
在輸入框中鍵入 Hex 色碼即可——有沒有開頭的 # 都可以。無論是完整的六位數寫法(#3498DB),或是三位數的縮寫(#39C,會自動展開為 #3399CC),都能正確辨識。工具會自動清除多餘字元、把色碼標準化,並即時顯示紅、綠、藍三色數值,同時附上即時色塊預覽與可直接複製貼上的 CSS 語法。
換算公式說明
十六進位(Hexadecimal)是以 16 為基底,使用數字 0–9 與字母 A–F(其中 A=10 … F=15)。每兩個字元為一組,換算規則為 數值 = 第一位數字 × 16 + 第二位數字。因此 FF = 15 × 16 + 15 = 255,也就是最大值;而 00 = 0,則是最小值。這三組數對會各自獨立解碼成 R、G、B 三個數值。
$$(R,\,G,\,B) = \bigl(\,\text{hex}_{[1,2]},\ \text{hex}_{[3,4]},\ \text{hex}_{[5,6]}\,\bigr)_{16}$$
$$\text{where}\quad \left\{ \begin{aligned} R &= \left(\text{Hex Code}\ \text{digits 1-2}\right)_{16} \\ G &= \left(\text{Hex Code}\ \text{digits 3-4}\right)_{16} \\ B &= \left(\text{Hex Code}\ \text{digits 5-6}\right)_{16} \end{aligned} \right.$$
實際範例
以 #3498DB 為例。紅色那組是 34 = \(3 \times 16 + 4 = 52\)(52)。綠色那組是 98 = \(9 \times 16 + 8 = 152\)(152)。藍色那組是 DB = \(13 \times 16 + 11 = 219\)(219)。換算結果為 rgb(52, 152, 219)——一款相當受歡迎的扁平化設計藍。
常見問題
支援像 #FFF 這樣的縮寫色碼嗎?支援。三位數的色碼會把每個位數各自重複一次來展開,所以 #FFF 會變成 #FFFFFF = rgb(255, 255, 255)。
那透明度(Alpha)通道呢?本工具處理的是三通道的 RGB 色彩。若輸入帶有 Alpha 的 8 位數 Hex 色碼,會只取前六位數來進行色彩換算。
要怎麼從 RGB 反推回 Hex?把每個通道的數值各自格式化成兩位數的十六進位數,再接在 # 後面串接起來即可。例如 52、152、219 → 34、98、DB → #3498DB。