若要在試算表內將 RGB 色頻值轉成 HEX 色碼,請結合 Excel 的 DEC2HEX 函數與字串串接,第二個參數務必傳入 2,讓每個色頻都能產生兩位十六進位數字:="#"&DEC2HEX(R,2)&DEC2HEX(G,2)&DEC2HEX(B,2)。HEX 標記法的寫法是將顏色寫成 #RRGGBB,其中每一對代表一個以 16 進位表示的 RGB 色頻(00 到 FF,也就是十進位的 0 到 255)。因此一個六位數的 HEX 可以描述 256 × 256 × 256 = 16,777,216 種不同的顏色——這與 CSS、HTML、Figma 和 Photoshop 使用的 24 位元色域相同,也正因為如此,在兩種格式之間互相轉換,對開發人員與設計師來說是極為常見的日常工作。Excel 並沒有內建的 RGB 轉 HEX 函數,所以 DEC2HEX 是標準的替代方案:它會將十進位整數轉成十六進位文字字串,再透過串接把三個色頻和「#」前綴重新組合成完整的色碼。無論你的 R、G、B 值是分別放在不同儲存格、放在一個需要先拆分的合併字串中,或是你直接以字面數字寫進公式,這個技巧都能正常運作。
最容易讓人卡關的部分是前導零的處理。DEC2HEX(10) 會回傳「A」而非「0A」,而缺少位數的 HEX 色碼和完整補位的色碼代表的是不同的顏色。使用 DEC2HEX(value, 2) 強制每個色頻輸出兩位數就能解決這個問題;公式設定好之後,最快的驗證方式就是把結果貼到 RGB 轉 HEX 轉換工具,它會即時顯示色塊並回報對應的 HSL 值,讓你在複製到樣式表或設計檔之前,先確認 Excel 產生的顏色是否正是你想要的。

RGB 轉 HEX 的 Excel 公式
Excel 的 DEC2HEX 函數會將十進位整數轉成十六進位文字字串。其語法為 DEC2HEX(number, [places]),其中 places 是選填的最小回傳字元數。若要從三個獨立的 RGB 儲存格組合出完整的 HEX 色碼——例如 A2 為紅、B2 為綠、C2 為藍——請在另一個儲存格輸入以下公式:
="#"&DEC2HEX(A2,2)&DEC2HEX(B2,2)&DEC2HEX(C2,2)
如果是單一常值顏色,例如常見的 UI 藍 (59, 130, 246),同樣的公式形式不需要儲存格參照也能運作:
="#"&DEC2HEX(59,2)&DEC2HEX(130,2)&DEC2HEX(246,2)
結果會回傳「#3B82F6」,也就是 Tailwind blue-500 色塊的 CSS 簡寫。其背後的運算相當直觀:十進位的 59 在 16 進位中是 3B(3 × 16 + 11),130 是 82(8 × 16 + 2),246 是 F6(15 × 16 + 6);與「#」前綴串接後便形成這個六位數的色碼。每個 RGB 值都必須是 0 到 255 之間的整數;瀏覽器工具會將超出範圍或非整數的輸入限制在有效範圍內,而不會直接報錯,這在複製設計師四捨五入不一致的色頻值時,是相當實用的安全機制。想了解背後數學原理而非試算表語法的使用者,可以閱讀 RGB 轉 HEX 公式指南,該文以手算方式逐步解說相同的轉換過程,有助於在 Excel 公式結果有誤時進行除錯。
在試算表中設定公式
- 開啟一個活頁簿,將紅、綠、藍三個色頻值分別放入三個儲存格。例如,將 59 放在 A2、130 放在 B2、246 放在 C2。
- 點選一個空白儲存格作為 HEX 色碼的輸出位置,然後輸入公式:="#"&DEC2HEX(A2,2)&DEC2HEX(B2,2)&DEC2HEX(C2,2)
- 按下 Enter,該儲存格會顯示 #3B82F6,包含前綴「#」與零補位的色頻。
- 若希望輸出小寫(現代 CSS 的慣例),可將公式包進 LOWER:=LOWER("#"&DEC2HEX(A2,2)&DEC2HEX(B2,2)&DEC2HEX(C2,2))
- 向下拖曳儲存格控制點即可一次轉換整欄 RGB 三元組,或將公式複製到相鄰的工作表中單次貼上即可套用。
- 若要驗證結果,請將 HEX 字串貼到 RGB 轉 HEX 轉換工具的 HEX 欄位,並查看一旁的色塊與 HSL 讀數。
如果你偶爾需要反方向操作——例如從樣式表複製了一個 HEX 值,想在 Excel 中讀出紅、綠、藍三個色頻——這部分同樣沒有乾淨的內建函數可用。HEX2DEC 一次只能處理一個色頻,所以你必須先將六位數的字串拆開,為每對加上前綴,再分別餵給 HEX2DEC,這個過程既脆弱又容易數錯。瀏覽器工具則在同一個地方處理兩個方向,而且會自動將像 #abc 這類簡寫展開為 #aabbcc。
Excel 使用者應知的 HEX 格式規則
在信任任何 HEX 字串之前——不管它是來自 Excel、樣式表還是設計師——了解這個標記法實際遵循的規則會很有幫助。瀏覽器工具也強制套用相同的規則,這也是為什麼不管你如何輸入,它的輸出永遠長得一模一樣。
| 規則 | 行為 | 範例 |
|---|---|---|
| 六位數形式 | 每個色頻兩個十六進位數字,零補位 | RGB (10, 0, 5) → #0A0005 |
| 三位數簡寫 | 每個位數重複一次以展開為完整值 | #abc → #aabbcc;#f00 → #ff0000;#fff → #ffffff |
| 「#」前綴可有可無 | 工具與 CSS 都接受加上或省略 | 3b82f6、#3b82f6 和 3B82F6 都視為相同 |
| 不區分大小寫 | 輸入的字母大小寫不影響比對結果 | ABC、abc 和 Abc 解析為同一顏色 |
| 輸出正規化 | 永遠是小寫六位數並補位 | 0 會輸出為 00,而非單獨的 0 |
| 超出範圍的色頻 | 限制在 0–255,而非直接報錯 | 300 → 255;-5 → 0 |
| 格式錯誤的 HEX | 明確標示錯誤,而非悄悄產生錯誤結果 | 長度錯誤或包含非法字元時會被拒絕 |
Excel 公式 vs. 瀏覽器轉換工具
兩種方法都能產生相同的顏色,差別在於哪一種更貼近你的工作流程。下表比較了這兩種做法,協助你挑選最適合的工具。
| 比較項目 | Excel DEC2HEX 公式 | 瀏覽器 RGB 轉 HEX 轉換工具 |
|---|---|---|
| 最適合的情境 | 批次轉換活頁表中已存在的整欄 RGB 三元組 | 檢查單一 HEX 字串、探索 HSL,或複製可直接使用的 CSS 值 |
| 需要的準備工作 | 需要 R、G、B 儲存格並貼上公式 | 無——開啟頁面即可開始輸入 |
| 前導零處理 | 需手動指定 ,2 參數;忘了設定就會悄悄產生過短的色碼 | 自動處理——輸出永遠正規化為小寫六位數形式 |
| 輸出大小寫 | 預設為大寫(DEC2HEX 會回傳 A–F);若需小寫可包進 LOWER | 永遠是小寫 |
| 顏色預覽 | 無——只會看到文字結果 | 隨輸入即時更新的色塊 |
| HSL 讀數 | 未提供 | 與 HEX 和 RGB 並列顯示 |
| 隱私/資料位置 | 保留在本地活頁簿中 | 完全以 JavaScript 在你的瀏覽器中執行——不會上傳任何資料 |
| 三位數簡寫 | Excel 無法解析——必須手動展開 | 支援:#abc 會展開為 #aabbcc |
驗證 Excel 輸出與常用參考值
拿到 Excel 產生的 HEX 字串後,請貼到轉換工具的 HEX 欄位,確認色塊與你預期的顏色一致。該工具會並列顯示 RGB、HEX 和 HSL,並提供複製按鈕讓你抓取需要的格式。由於轉換完全在本機 JavaScript 中執行,不會上傳任何數值,這在處理尚未發布的品牌色票或私有的設計規格時格外重要。即時預覽也能讓 Excel 產生格式錯誤字串的狀況顯而易見——例如忘了在儲存格參照中加上逗號時,Excel 會回傳「#VALUE!」,但在轉換工具頁面上只會直接無法解析,這是更快的訊號,能讓你發現上游有東西需要修正。
下方的數值提供快速的驗證參考。每一列都是一組標準的參考顏色,可用來確認 Excel、瀏覽器轉換工具以及你的樣式表對色碼意義的解讀完全一致:
- 黑色 — RGB (0, 0, 0) → #000000
- 白色 — RGB (255, 255, 255) → #ffffff
- 純紅 — RGB (255, 0, 0) → #ff0000
- 純綠 — RGB (0, 255, 0) → #00ff00
- 純藍 — RGB (0, 0, 255) → #0000ff
- UI 藍 — RGB (59, 130, 246) → #3b82f6
把上方任一 HEX 字串貼進轉換工具,即可看到色塊與對應的 HSL。如果你用前一節的公式在 Excel 中重現這些值,試算表會以大寫形式回傳相同的字串——例如 #3B82F6——這純粹只是大小寫的差異而非顏色的差異,因為 HEX 本身不區分大小寫,且現代 CSS 將「#3b82f6」與「#3B82F6」視為相同的值。當你想把顏色調亮或提高飽和度,又不想盲目猜測新的色頻值時,HSL 讀數就非常實用;只要在瀏覽器工具中將 HEX 轉回 HSL,調整飽和度或亮度值,就能直接讀出新的 HEX。