工具用的順手嗎？
你的回饋能幫助我們做得更好
RGB與HSB/HSV色彩程式碼雙向轉換工具，支援多種輸入格式，適用於設計師和開發者。
概覽
了解工具能解決的問題、計算或處理邏輯，以及資料邊界。
這個轉換器在三種表示之間保持同步：RGB 用紅、綠、藍三個通道描述顏色；HSB 用色相、飽和度和明度描述顏色；HEX 則把 8 位 RGB 通道寫成十六進制。這裏的 HSB 與 HSV 是同一個模型，B（Brightness）對應 HSV 的 V（Value），不是另一套演算法。
| 表示 | 本工具的範圍 | 怎樣理解 |
|---|---|---|
| RGB | R、G、B 均為 0–255 的整數 | 三個通道分別控制紅、綠、藍分量 |
| HSB | H 為 0–360°；S、B 為 0–100% | H 選擇色相位置，S 控制從灰到純色的程度，B 取歸一化 RGB 中最大的通道值 |
| HEX | #RRGGBB，也可輸入三位簡寫 #RGB | 每兩個十六進制數字依次編碼 R、G、B；三位簡寫會展開成六位 |
例如 #7CC464 中的 7C、C4、64 分別等於十進制 124、196、100，因此對應 RGB(124, 196, 100)。轉換後的 HSB 為 H 105°、S 49%、B 77%。
先把 R、G、B 除以 255，記為 r、g、b；再取最大值 M、最小值 m 和差值 Δ。明度 B 直接來自最大通道，飽和度表示最大值與最小值的相對差距。
r = R / 255，g = G / 255，b = B / 255
M = max(r, g, b)，m = min(r, g, b)，Δ = M − m
B = 100 × M
S = 0（M = 0 時）；否則 S = 100 × Δ / M色相 H 按最大通道所在的六個 60° 區段計算：最大通道為紅、綠、藍時分別從 0°、120°、240° 附近求偏移；負角度會迴繞到 0–360°。當 Δ = 0 時，顏色位於黑—灰—白軸上，色相在數學上沒有定義，本工具顯示為 0°。最終 H、S、B 都四捨五入為整數。
指南
依步驟完成操作，並透過範例核對輸入與結果。
已知十進制通道時，調整 RGB 區域的 R、G、B 滑塊；已知 HSB 時，直接調整 H、S、B 滑塊；已有網頁顏色程式碼時，在 HEX 輸入框填寫 #RRGGBB 或 #RGB。也可以開啟取色器或選擇常用顏色預設。
任一有效輸入發生變化後，顏色預覽、HEX、RGB 與 HSB 會一起更新。調整 HSB 時尤其注意右側第三個分量是 B（明度），不是 HSL 的 L（亮度）。
可以複製完整 HEX、RGB 表示式、單個 H/S/B 數值，或使用“複製全部”取得 RGB、HEX 與 HSB 的彙總結果。若只需交付給樣式表，通常複製 HEX 或 RGB；若需在設計軟體中繼續調色，則記錄 HSB 三個分量。
點選重置會回到 #3B82F6，即 RGB 59、130、246；本工具顯示的 HSB 為 217°、76%、96%。
輸入 #7CC464，得到 RGB 124、196、100。歸一化最大通道為 196/255，故 B 四捨五入為 77%；通道差為 96，S = 96/196，四捨五入為 49%；綠色為最大通道，色相得到 105°。結果為 HSB 105°、49%、77%。
把 H 調到 30°、S 調到 100%、B 調到 100%，色相位於紅與黃之間且沒有灰分量，得到 RGB 255、128、0，並同步顯示 HEX #FF8000。這也說明反向轉換會把連續比例對映回 0–255 整數通道。
#808080 的三個 RGB 通道都為 128，最大值與最小值相同，因此 S 為 0%，B 約為 50%，本工具顯示 HSB 0°、0%、50%。此時改變 H 不會改變灰色外觀。
情境
查看這項工具在不同工作與生活流程中的用法。
設計師從顏色面板讀到 HSB 後，可用右側滑塊還原顏色，再複製六位 HEX 或 RGB 表示式給開發人員，避免把 HSB 數字誤當成 HSL。
品牌規範同時列出 HEX、RGB 與 HSB 時，可任選一組輸入，再比對另外兩組。若只差 1 個整數通道，應先檢查原資料的舍入精度，而不是直接判斷顏色錯誤。
已有 HEX 顏色但希望保持色相、降低飽和度或壓低明度時，先讓工具換算到 HSB，再逐項移動滑塊並觀察預覽，最後複製新的 HEX。
問答
集中解答常見疑問與容易混淆的問題。
在本工具採用的模型中沒有數值區別。HSB 的 B 表示 Brightness，HSV 的 V 表示 Value，兩者對應同一第三分量，所以 H、S、B 數值可按 H、S、V 讀取。
不可以。兩者雖然都使用色相與飽和度，但第三分量定義不同，飽和度計算也隨模型變化。例如純紅在 HSB 中是 0°、100%、100%，在 HSL 中則是 0°、100%、50%。應執行轉換，不能只把 B 改名為 L。
當 R、G、B 相等時，飽和度為 0，改變色相不會改變顏色，因此色相沒有唯一值。0°只是本工具用於顯示無彩色結果的約定，並不表示灰色含有紅色色相。
因為本工具把 H、S、B 和 RGB 都顯示為整數。第一次轉換會捨去中間小數，再反向計算時可能落到相鄰的 8 位 RGB 整數；需要嚴格保留原色時，以原始 HEX/RGB 爲準。
截至 2026-09-14，W3C CSS Color Level 4 列出的顏色函式不包含 hsb() 或 hsv()。用於 CSS 時請複製等價的 HEX 或 rgb()；不要把 HSB 數字改名後直接寫成 hsl()。
須知
使用前了解適用範圍、結果限制與必要提醒。
本工具輸出的是 8 位整數 RGB、六位 HEX 和整數 HSB，適合常規螢幕顏色標註與格式換算。連續色值被量化後，往返轉換可能出現 1 個 RGB 通道單位或 1 個百分點的差異。
推薦
查找相關工具、專題與可用的 API 能力。