透過 MCP 連接 →

輸入計算

輸入 3 碼或 6 碼的 HEX 色碼,開頭的 # 加不加皆可。

數學公式

廣告

結果

RGB 色彩
rgb(52, 152, 219)
from #3498DB
紅 (R) 52
綠 (G) 152
藍 (B) 219

什麼是 HEX 轉 RGB 轉換器?

HEX 轉 RGB 轉換器可以把十六進位色碼(也就是 CSS、HTML 與各種設計軟體中常見的六位字元寫法)換算成對應的 RGB 數值。RGB 是用紅、綠、藍三個色彩通道來描述顏色,每個通道的範圍都是 0 到 255。而 HEX 色碼則是把這三個數值用 16 進位的方式壓縮成一段精簡的字串,例如 #3498DB

使用方式

在欄位中輸入任何 HEX 色碼即可。開頭的 # 加不加都沒關係,你也可以使用 3 碼的縮寫格式(例如 #0AF),系統會自動展開成完整的 6 碼形式(#00AAFF)。按下計算後,就會看到 RGB 三組數值、色塊預覽,以及每個通道個別拆解後的數值。

計算公式說明

一組 6 碼的 HEX 色碼會被拆成三對:第 1–2 個字元代表紅色,第 3–4 個字元代表綠色,第 5–6 個字元代表藍色。每一對都是一個 16 進位(十六進位)數字,再換算成 10 進位(十進位)。

$$\begin{gathered} (R,\,G,\,B) = \left( \text{hex}_{1\text{-}2},\ \text{hex}_{3\text{-}4},\ \text{hex}_{5\text{-}6} \right)_{16} \\[1.5em] \text{where}\quad \left\{ \begin{aligned} R &= \big(\,\text{HEX}\,[1\text{-}2]\,\big)_{16} \\ G &= \big(\,\text{HEX}\,[3\text{-}4]\,\big)_{16} \\ B &= \big(\,\text{HEX}\,[5\text{-}6]\,\big)_{16} \end{aligned} \right. \end{gathered}$$

舉例來說,FF 等於 \(15 \times 16 + 15 = 255\),也就是最高強度;而 00 則等於 0。

圖示將六位十六進位代碼分成三對,分別對應紅、綠、藍通道
6 位十六進位代碼分成三對,每對轉換為 R、G、B 的 0-255 數值。

實際範例

#3498DB 為例:紅色 = 34 = \(3 \times 16 + 4 = 52\);綠色 = 98 = \(9 \times 16 + 8 = 152\);藍色 = DB = \(13 \times 16 + 11 = 219\)。最後結果就是 rgb(52, 152, 219)——一個討喜的中藍色。

十六進位值 FF8800 轉換為 RGB 255, 136, 0 並附色塊
範例:#FF8800 轉換為 RGB (255, 136, 0),一個橙色色塊。

常見問題

一定要加 # 符號嗎?不用。轉換器會自動把它去掉,所以 3498db#3498DB 得到的結果完全相同。

HEX 色碼有分大小寫嗎?沒有。ffFF 是一樣的,本工具會把所有字元統一轉成大寫。

那 3 碼的縮寫怎麼處理?#F00 這種縮寫,系統會把每個字元各複製一次,展開成 #FF0000,也就是 rgb(255, 0, 0)(純紅色)。

最後更新: