一份附有代碼的 CMYK 色票是將每個顏色與其識別編號配對的參考表，而在瀏覽器和 CSS 的工作中，最可靠的起點是 148 個 CSS 命名顏色，而不是背誦一套印刷色百分比。HTML 顏色名稱表列出了 CSS Color 4 中標準化的每個不透明命名顏色關鍵字，並附上其精確的小寫 #RRGGBB 值、十進位 rgb() 讀數，以及一個實際渲染的色塊。每一列都是一個穩定、可直接複製的顏色權標:把 HEX 貼到樣式表裡、與 W3C 規範比對，或直接交給同事都不會產生歧義。關鍵字層也讓這張表可以反向執行 — 輸入像 gold 之類的片段來找出符合的色塊，或貼上 #ff00ff 來確認關鍵字(它同時是 fuchsia 與別名 magenta)。標準化的別名會保留為獨立的列而非合併，因為每種拼法都是一個有效的 CSS 識別字，可能會出現在實際上線的樣式表。一切都不會離開瀏覽器;這個表格在本地端渲染與複製，不會發出任何網路請求。
HTML/CSS 顏色代碼實際上是什麼
「附有代碼的 CMYK 色票」這個說法聽起來像是可印刷的印刷色，但大多數網頁和 CSS 工作流程根本用不到青色、洋紅、黃色和黑色通道。你實際會貼到樣式表中的代碼有三種形式:
- #RRGGBB 是一個六位數的小寫十六進位字串。前兩位是紅色，接著兩位是綠色，最後兩位是藍色，每個值從 00 到 ff(0–255)。這個表格一律依 CSS 文法回傳小寫。
- rgb(r, g, b) 用三個十進位數表示同樣的資訊，例如 rgb(255, 0, 0)。有些樣式表也接受百分比語法，例如 rgb(100%, 0%, 0%)，但這個表格只會完整精確地比對 rgb(255, 0, 0) 這類字串。
- CSS 關鍵字 本身，例如 red、tomato 或 rebeccapurple，只是簡寫;瀏覽器在繪製之前會先把它解析為 HEX。
CSS Color 4 定義了 148 個不透明關鍵字，加上兩個特殊用途的識別字(transparent 和 currentColor)，這個表格刻意不收錄它們。W3C CSS Color 4 規範的命名顏色章節是這 148 列的權威來源;這個表格以穩定順序鏡像列出該清單，因此搜尋 rebeccapurple 會得到與規範相同的值。
用代碼而非關鍵字來搜尋色票
網路上大多數的參考表都假設你從顏色名稱出發、想找出代碼。HTML 顏色名稱表則是以相反方向建構的。把 #3366cc 貼進篩選器，表格就會縮減到一個關鍵字 — royalblue — 並在同一列顯示其對應的 rgb(51, 102, 204)。輸入一個完整的 rgb(255, 215, 0)，色票就會回傳 gold。這個反向方向正是設計師和前端開發者在進行樣式工作時把色票一直開著的主要原因:只要按一個鍵就能回答「這個十六進位色碼背後的精確名稱是什麼?」，而且絕不會憑空生出同義詞。像 255 這種簡短的數字片段不會回傳任何結果，而不是猜測一個接近的通道值，因此你可以信任那唯一出現的一列。
找出任何 HEX 或 rgb() 值背後的 CSS 名稱
- 開啟 HTML 顏色名稱表，找到表格上方的篩選輸入欄。
- 輸入關鍵字片段以依名稱瀏覽，貼上精確的 #RRGGBB 以對應一個顏色，或貼上一個完整的 rgb(r, g, b) 字串。
- 在同一列檢視對應的標準化關鍵字、實際渲染的色塊、小寫的 HEX，以及十進位的 rgb() 讀數。
- 點擊 HEX 欄位即可將精確的值複製到剪貼簿;若剪貼簿權限被拒，請手動選取並複製可見的文字 — 不會附加任何隱藏格式。
- 清除篩選輸入欄以恢復完整的 148 列規範順序。
當沒有符合的項目時，色票會顯示「無符合」訊息，而不是以接近的顏色替代。搜尋結果依關鍵字保持 ASCII 字母順序，這也是 W3C 表格的排列方式。以 # 開頭的搜尋一律使用精確的 HEX 比對，因此漏掉任何一位數都會得到零結果，而不是誤判為符合。資料集的不變條件 — 148 列、148 個獨立鍵、每個值六位小寫十六進位數字 — 能在維護時防止遺漏項目與通道調錯。
148 個不透明列是如何組織的
HTML 顏色名稱表的每一列包含一個 CSS 關鍵字、一個小寫的 #RRGGBB 值、一個十進位的 rgb(r, g, b) 讀數，以及一個實際渲染的色塊。148 這個數字直接來自 CSS Color 4 的命名顏色清單，MDN 的命名顏色參考有詳細的鏡像內容。transparent 和 currentColor 的列是刻意排除的。transparent 會解析為透明的黑色而非固定的不透明色塊，而 currentColor 會依據每個元素的計算 color 屬性而定，因此這兩者都沒有可單一複製的 HEX。把它們納入計數會產生誤導性的數字對應。
標準化的別名會保留為獨立列，而不是合併。aqua 和 cyan 都對應到 #00ffff;fuchsia 和 magenta 都對應到 #ff00ff。幾個灰色詞彙的美式與英式拼法也並存 — gray/grey、dimgray/dimgrey、lightgray/lightgrey 等等。它們看起來像重複項目，但每種拼法都是真實的 CSS 識別字，可能會出現在你正在維護的舊樣式表，因此這個表格依規範保留它們。篩選永遠不會合併別名、不會把顏色轉換到另一個色彩空間、也不會憑空產生模糊的同義詞。
為什麼兩個名稱可以對應到同一個 HEX
CSS Color 4 刻意把某些關鍵字列為同一個 sRGB 值的別名。色票將它們保留在獨立列，讓你能分別確認每種拼法。以下是一個具體的參考:
| 關鍵字 | 小寫 HEX | rgb() 讀數 |
|---|---|---|
| aqua | #00ffff | rgb(0, 255, 255) |
| cyan | #00ffff | rgb(0, 255, 255) |
| fuchsia | #ff00ff | rgb(255, 0, 255) |
| magenta | #ff00ff | rgb(255, 0, 255) |
| gray | #808080 | rgb(128, 128, 128) |
| grey | #808080 | rgb(128, 128, 128) |
每一對中的兩個名稱都是有效的 CSS 識別字。使用 aqua 的舊樣式表與使用 cyan 的新設計系統會呈現完全相同的結果;這個色票只是確認了這一點。你是否要選擇在自己的程式碼庫中去除重複的名稱，是風格決定而非顏色決定。相同的原則也適用於 gray/grey 這一對:色票把重複的對應記錄下來，而不是加以隱藏。
把 HEX 反向轉換為 CMYK 代碼
「附有代碼的 CMYK 色票」這個關鍵字通常代表印刷用的印刷色百分比。CSS 命名顏色是以 sRGB 定義的，因此要把命名顏色轉換為 CMYK，必須經過一次未校色的轉換，其精準度會依目的地印刷機、紙張與色彩描述檔而定。HTML 顏色名稱表停留在 sRGB，絕不會在頁面上轉換為青色、洋紅、黃色或黑色。若需要大約的 CMYK 百分比，請把複製下來的 HEX 貼到相關的轉換工具 — 那是為印刷端打造的獨立工作流程，而非命名顏色表格中的一欄。
一個實用的順序:開啟色票，搜尋像 crimson 之類的關鍵字，確認其 HEX 為 #dc143c，複製該值，再送入印刷轉換器，以讀出大約的 cmyk(0%, 91%, 72%, 14%)。這個四通道數字只是個起點 — 在沒有色彩描述檔的情況下，它無法告訴你油墨在特定印刷機上會呈現什麼樣子。請把 CMYK 數字視為未校色的基準，並在出版前以實體打樣加以驗證。
何時該改用其他工具
HTML 顏色名稱表是參考資料，而非產生器。當你的工作超出它的範疇時，請改用其他工具:
- 你需要實際的 CMYK 百分比。使用專門的 RGB→CMYK 或 CMYK→RGB 轉換器來處理螢幕到印刷的轉換。
- 你正圍繞一個基準色建立調色盤。請使用互補、類似或三角配色產生器，而不是盯著 148 列看。
- 你正在檢查可讀性。請使用對比檢查工具對照 WCAG AA 或 AAA 比率;單一命名顏色無法回答前景與背景配對的對比問題。
- 你需要舊式的 216 色立方體。若你正在維護鎖定 216 通道色盤的舊樣式表，請開啟網頁安全顏色參考。
- 你正在取樣影像的平均 HEX。請使用影像取色工具，而不是試圖用眼睛比對。
這個色票不會宣稱自己具備感知均勻性、科學分類法、無障礙評等，或是你的螢幕是否能重現實體顏料。某些相鄰的 CSS 名稱看起來會意外地相似，有些名稱也無法一致地描述相對亮度。它唯一的工作就是為每個 CSS 關鍵字提供一個穩定的對應，讓你可以直接複製。若想深入了解由相同 148 個名稱所衍生的 CMYK 端工作流程，請參閱《CMYK 顏色代碼及其 CSS 命名顏色對等值》，該文從關鍵字走向可印刷的百分比，方向正好相反。