您可以將影像中的色碼轉換為 RGB 色頻，方法是將任何 CSS 十六進位色彩 — #RGB、#RGBA、#RRGGBB 或 #RRGGBBAA — 貼到 HEX 轉 RGB 轉換器 中。貼上後，您會立即看到正規化後的小寫十六進位值、各別的紅、綠、藍色頻位元組（以 0 到 255 的整數表示）、選擇性的 Alpha 位元組，以及一個可直接放入樣式表的 CSS rgb() 或 rgba() 字串。如果您的影像滴管、截圖工具或設計應用程式給了您像 #1A6FE3 或 #1A6FE380 這樣的色碼，轉換器會展開簡寫形式、保留您的 Alpha 位元組，並在數字旁邊即時顯示預覽，讓您能一眼看出色頻順序的錯誤。所有解析、格式化、驗證和預覽渲染都在當前瀏覽器本機完成，因此色彩字串絕不會離開您的裝置。這讓此工具成為您已從影像取得的十六進位值，與 API、Canvas 作業或設計代碼實際需要的色頻層級輸入之間的快速橋樑。
許多設計工具、截圖工具和瀏覽器滴管會將從像素取樣的色彩以十六進位字串顯示。十六進位很方便分享，但當您需要將色彩輸入到像 fillStyle 這樣的 Canvas API、分析腳本、CSS 自訂屬性配對，或程式碼審查註解時，您通常會希望將紅、綠、藍的整數值分開列出。轉換器正好能完成這項翻譯，而且執行嚴格，因此您可以信賴它回傳的數字。
轉換器接受的格式
輸入解析器遵循 W3C CSS 色彩模組第 4 級十六進位表示法，而非每個設計工具可能容忍的簡寫形式。開頭的井字號是必要的，且該值必須恰好是 3、4、6 或 8 個 ASCII 十六進位數字，使用 0 到 9 和 A 到 F 的字元。大寫和小寫字母意義相同。完整值周圍的一般空白會被修剪，但轉換器會拒絕缺少井字號、雙重井字號、數字內嵌空白，以及任何不在十六進位字元集中的字元。這種嚴格的界線讓無效的 CSS 代幣保持可見，而不是靜默猜測您的意思。
三位數和六位數的輸入不指定 Alpha，在預覽中視為完全不透明。四位數和八位數的輸入包含透明度。簡寫標記透過複製每個半位元組來展開，因此 #123 表示 #112233，而 #0f08 表示 #00ff0088。紅色在前、綠色第二、藍色第三，當有 Alpha 時則 Alpha 在最後。最後一點很重要，因為 CSS 之外的一些八位數色彩慣例會將不透明度放在首位，但轉換器永遠不會根據輸入的視覺結果重新排序 — 它遵循 CSS 規則。
| 形式 | 範例 | 展開為 | 是否有 Alpha | CSS 輸出 |
|---|---|---|---|---|
| #RGB | #1A6 | #11aa66 | 否 | rgb(17,170,102) |
| #RGBA | #1A6F | #11aa66ff | 是（不透明） | rgba(17,170,102,1) |
| #RRGGBB | #1A6FE3 | #1a6fe3 | 否 | rgb(26,111,227) |
| #RRGGBBAA | #1A6FE380 | #1a6fe380 | 是（約 0.502） | rgba(26,111,227,0.502) |
如何將影像中的色碼轉換為 RGB
無論您的十六進位值是來自 Photoshop 滴管、瀏覽器滴管，還是截圖標註工具，工作流程都相同：複製滴管給您的十六進位字串，將其貼到轉換器中，然後讀取結構化的輸出。整個循環是即時的，不需要任何註冊或上傳步驟。
- 從您的影像滴管、截圖工具或設計應用程式複製色碼，確保選取範圍中包含開頭的井字號。
- 開啟 HEX 轉 RGB 轉換器，並將該值貼到輸入欄位中。
- 讀取輸出頂端的正規化小寫十六進位值 — 這是轉換器內部使用的展開後六位數或八位數形式。
- 檢查紅、綠和藍的各別色頻位元組（每個以 0 到 255 之間的整數顯示），以及當您的輸入包含透明度時的 Alpha 位元組。
- 複製 CSS rgb() 或 rgba() 字串以用於樣式表，如果影像處理 API 需要將其作為各別數字，則複製色頻位元組。
- 快速查看即時預覽以確認色頻順序符合您的預期；如果色塊看起來不對，請重新檢查來源工具是否使用了非 CSS 慣例，如 #AARRGGBB。
- 對於半透明的色彩，分享精確往返值時請保留正規化的八位數 HEX 值，因為四捨五入的小數 Alpha 可能會損失少量精度。
讀取色頻位元組和 CSS 輸出
正規化十六進位色彩的每個兩位數元件都是 00 到 FF 的 16 進位整數，對應於 0 到 255 之間的色頻值。端點是 0 和 255，兩者之間的每個值都是單一整數 — 色頻內部沒有小數。當您貼上 #1A6FE3 時，轉換器會讀取 1A 為紅色（26）、6F 為綠色（111）、E3 為藍色（227），然後為 CSS 形式輸出 rgb(26,111,227)。當 API、Canvas 作業、影像編輯器、測試 fixture 或設計代碼需要各別的數字輸入時，請使用整數位元組；對於接受 rgb() 或 rgba() 的樣式，請使用 CSS 輸出。
正規化的 HEX 永遠是小寫，且永遠會展開為標準的六位數或八位數形式。這表示您可以貼上 #abc 並讀回 #aabbcc，或貼上 #1A6FE380 並讀取 #1a6fe380。展開是一個純粹的格式化步驟，因此底層的色彩並不會改變。MDN hex-color 參考文件記載了相同的展開規則，這就是為什麼同一色彩的簡寫和完整形式會回傳相同的色頻位元組。
Alpha 位置與小數四捨五入
CSS 將 Alpha 放在八位數十六進位值的末尾，因此順序永遠是 #RRGGBBAA。轉換器不會將第一個位元組視為 Alpha，也永遠不會重新排序輸入。如果來源工具給您一個看起來像 #AARRGGBB 的八位數代碼，轉換器仍會將第一對解析為紅色，您應該預期結果會與來源工具顯示的完全不同。這是當十六進位值來自影像或不遵循 CSS 慣例的程式庫時，最常見的色頻順序錯誤。
一旦 Alpha 位元組被解析，轉換器會將其除以 255 以產生 0 到 1 的不透明度。為了易於閱讀的 CSS 輸出，非端點的 Alpha 值會顯示至小數點後三位，並移除尾隨的零，而精確的 Alpha 位元組仍會在其旁邊顯示，百分比則顯示至小數點後兩位。位元組 0x80 儲存為 128，顯示為約 0.502 的不透明度；0x00 正好是 0，0xFF 正好是 1。這種顯示的四捨五入並不會改變原始正規化的八位數十六進位值，因此您仍可以將其貼回並取得相同的位元組。當您需要精確的往返精度時，請分享正規化的 HEX；當小數值即可時，請分享 rgba() 輸出。
此工具不做的事情
此轉換器是一個嚴格的 CSS 十六進位解析器，而非通用的色彩工作平台。它不會從影像中取樣像素，因此您仍然需要一個獨立的滴管來從照片或截圖中擷取十六進位值 — 一旦您有了該十六進位值，轉換器會將其轉換為 RGB。它也不會解析命名色彩（如 rebeccapurple）、hsl()、lab()、lch()、color()、系統色彩、CSS 變數、漸層或逗號分隔的調色盤。沒有色彩空間之間的轉換、沒有對比度測量、沒有無障礙前景色建議，也沒有聲稱兩種色彩看起來相同。十六進位 CSS 色彩代表 sRGB 色頻值；它們不是 Pantone、CMYK、印刷油墨配方或物理測量值。
如果您需要無障礙的對比比例，色彩對比度檢查器接受相同的十六進位輸入並回傳符合 WCAG 的數字。如果您需要印刷用的基本 process-color 估算值，RGB 轉 CMYK 轉換器會翻譯色頻位元組，同時請記住實際的印刷生產仍然需要受管理的色彩描述檔和打樣工作流程。對於想要從頭到尾更完整地了解色頻數學運作的讀者，色頻位元組與 Alpha 指南以更多細節擴展了相同的範例。
無效或空的輸入會以清晰的錯誤取代先前的轉換結果，因此過時的成功結果絕不會被呈現為屬於當前值。如果解析器拒絕您的輸入，請重新檢查是否缺少井字號、多餘的數字、內嵌空白或非十六進位字元，然後將更正後的值重新貼上。預覽是根據您的瀏覽器會使用的同一個 CSS 色彩字串所產生，這使其成為色頻順序的有用健全性檢查，但它並非色彩管理參考 — 螢幕、瀏覽器描述檔、顯示亮度、環境光和廣色域工作流程都可能讓相同的數值 sRGB 色彩呈現明顯不同的外觀。
相關閱讀：是否應該使用影像中的平均色彩？檢查清單。