WEB安全色對照表大全
工具用的順手嗎?
你的回饋能幫助我們做得更好
查詢216種Web安全色名稱、十六進制程式碼和RGB值對照表。
Web 安全色(Web Safe Colors)是早期瀏覽器和顯示器在 256 色環境下都能穩定還原的一組標準顏色,常用於跨平臺的網頁配色對照。
概覽
了解工具能解決的問題、計算或處理邏輯,以及資料邊界。
這個對照表呈現固定的 216 種 RGB 色塊,每個色塊同時標示六位 HEX 色碼與 RGB 十進位值。它適合快速瀏覽傳統 Web 安全色,或在既有設計、教材和程式碼中核對色值。頁面資料沒有顏色名稱欄位,也不會把任意輸入的顏色轉成最接近的色票;查詢範圍就是這組固定色表。
每個紅、綠、藍通道各取六個值:HEX 的 00、33、66、99、CC、FF,換成十進位分別是 0、51、102、153、204、255。因此色數為 6 × 6 × 6 = 216。例如 #3366CC 的三個通道是 33、66、CC,換算後為 rgb(51, 102, 204)。
00
33
66
99
CC
FF
#3366CC
rgb(51, 102, 204)
「Web 安全色」是沿用至今的歷史名稱,指上述離散色彩立方體,不代表無障礙檢測通過、品牌合規或跨螢幕完全一致。W3C 的 CSS 色彩規格也定義其他色彩表示方式;現代網頁不必只從這 216 個值挑選。查看 W3C CSS Color Module Level 4。
指南
依步驟完成操作,並透過範例核對輸入與結果。
在「顏色搜尋」輸入 HEX 或 RGB 文字片段,可輸入有無井字號的部分內容,例如 ff00、#003 或 153。搜尋不區分大小寫,會比對色碼文字與 RGB 字串。
ff00
#003
153
查看符合筆數與色塊。清空搜尋欄即可回到全部 216 個項目;沒有符合項目時,改用較短或不同格式的片段再試。
在「顯示格式」選 HEX 或 RGB,再點選目標色塊。複製到剪貼簿的內容會依目前選項輸出,例如 HEX 為 #3366CC,RGB 為 rgb(51, 102, 204)。
將複製值貼到 CSS 或設計備註中,並在實際版面檢查前景、背景和文字的呈現。
搜尋是字串片段篩選,並非輸入任意完整色碼後尋找相近色。像 rgb(51 會找出 RGB 字串含有該片段的記錄;若要查精確色值,可用其完整 HEX 或 RGB 寫法搜尋。
rgb(51
情境
查看這項工具在不同工作與生活流程中的用法。
需要沿用既有 216 色調色盤時,可按熟悉的 HEX 片段找色,複製所需格式到樣式草稿,再於實際頁面確認效果。
教學者可用同一個色塊對照兩種寫法,說明每一組十六進位通道如何對應到 0–255 的十進位數字。
團隊需要一組共同參照的離散色值時,可瀏覽色塊並傳遞 HEX 或 RGB 數字;這個參考值仍需搭配專案的品牌與介面規範評估。
問答
集中解答常見疑問與容易混淆的問題。
不行。這份色表只提供色塊、HEX 與 RGB 值,沒有名稱欄位;請改用色碼或 RGB 片段搜尋。
不會。搜尋只過濾現有 HEX/RGB 字串,不會計算色彩距離或轉換成近似色。若沒有符合項目,請清空搜尋或改查色表中已列出的值。
由「顯示格式」決定。選 HEX 會複製六位十六進位色碼,選 RGB 則複製 rgb(...) 格式;兩種數值仍都會顯示在色塊上供核對。
rgb(...)
不代表符合。色表不會檢查文字與背景的對比,也不會評估字級或介面狀態;應針對實際配色組合另行檢測。
須知
使用前了解適用範圍、結果限制與必要提醒。
名稱中的「安全」不等於無障礙、安全性或品牌認證,也不能保證不同螢幕、瀏覽器、色彩管理設定與環境會呈現完全相同的視覺效果。色塊用於快速辨識,實際專案請核對色值,並在目標裝置和版面檢查。
這裡只列傳統 216 種組合,並非完整 CSS 命名色或所有可用色彩空間;也不含印刷色轉換、對比度分析或任意色碼的近似配對。文字與背景的可讀性、品牌要求及印刷輸出,需依各自規範另行確認。
推薦
查找相關工具、專題與可用的 API 能力。