在所有常見的顏色格式之間轉換
設計師、開發人員和行銷人員經常需要在不同工具之間轉換色碼：CSS 使用 HEX 或 HSL，品牌指南標示 RGB 和 CMYK，而設計軟體則顯示 HSB。這款色碼轉換工具可以接收上述任何格式的顏色，並一次顯示所有其他格式的轉換結果，每個結果皆提供一鍵複製功能。它還能檢查文字對比度以符合無障礙網頁標準，並產生一系列的深淺色階。
功能特色
- 支援任何輸入格式：HEX（3、4、6 或 8 位數）、RGB/RGBA、HSL/HSLA、HSV/HSB、CMYK、三組純數字以及 CSS 顏色名稱。
- 一次顯示所有輸出結果：HEX、RGB、HSL、HSV 和 CMYK，每個結果皆附有複製按鈕。
- 支援透明度 — HEX8、RGBA 和 HSLA 格式會保留 Alpha 值。
- 原生選色器，可透過視覺化方式挑選顏色。
- WCAG 對比度檢查，測試與黑色和白色的對比，並提供一般文字與大型文字的 AA 級測試結果。
- 深淺色階，提供亮度從 10% 到 90% 的色階；點擊任何色塊即可載入該顏色。
顏色格式說明
- HEX —
#RRGGBB十六進位色碼，是網頁設計中最常見的格式。可選擇加入第四組數值來設定透明度。 - RGB — 紅、綠、藍值介於 0 到 255 之間；這是螢幕實際產生顏色的方式。
- HSL — 色相（在色相環上的位置）、飽和度（色彩強度）和亮度。非常容易手動調整：只需改變亮度，即可獲得同一個顏色的較淺或較深版本。
- HSV / HSB — 色相、飽和度和明度（亮度），大多數設計軟體的選色器皆使用此格式。
- CMYK — 青色、洋紅色、黃色和黑色（Key）的油墨百分比，主要用於印刷。
範例
天藍色 #0EA5E9 的數值為 rgb(14, 165, 233)、hsl(199, 89%, 48%)、hsv(199, 94%, 91%)，大約等於 cmyk(94%, 29%, 0%, 9%)。它與白色的對比度約為 2.8:1 —— 適合用於大型標題和圖示，但對於標準需要 4.5:1 的內文來說則太低了。在黑色背景上，對比度可達約 7.6:1，輕鬆達標。
色彩運用技巧
- 使用 HSL 建立調色盤。 保持色相與飽和度不變，僅調整亮度，即可建立一致的按鈕狀態、背景與邊框色彩。
- 及早檢查對比度。 許多品牌色在白色背景上作為文字會顯得太淺；建議文字使用同色階中較深的顏色，原色則用於強調元素。
- 不要僅靠顏色 來傳達資訊 —— 請為色弱或色盲使用者加上圖示或標籤。
- 預期印刷會有色差。 明亮的 RGB 色彩（尤其是鮮豔的藍色與綠色）在轉為 CMYK 印刷時，通常會顯得較為暗淡。
也需要處理圖片嗎？圖片轉檔工具 可以在 JPG、PNG 和 WebP 格式之間進行轉換。如果需要將小圖片或圖示編碼供 CSS 使用，請使用 Base64。