其他
色碼轉換
色碼轉換是一款可在 HEX、RGB、HSL、HSV、OKLCH 各格式之間互相轉換的工具。只要輸入一個顏色,就會同時計算並列出所有對應格式的表示法,且各個值都能一鍵複製。從 HEX 轉 RGB(hex rgb 轉換)、RGB 轉 HEX、HSL 轉換到 RGBA 轉換,Web 與設計製作所需的各種轉換都能一併完成。
轉換為各格式
| 格式 | 值 | 複製 |
|---|---|---|
| HEX | #1E90FF | |
| HEX8 | #1E90FFFF | |
| RGB | rgb(30, 144, 255) | |
| RGBA | rgba(30, 144, 255, 1) | |
| HSL | hsl(210, 100%, 56%) | |
| HSLA | hsla(210, 100%, 56%, 1) | |
| HSV | hsv(210, 88%, 100%) | |
| OKLCH | oklch(0.652 0.19 253) | |
| CMYK | cmyk(88%, 44%, 0%, 0%) |
CMYK 是用於印刷的參考值。由於會依色域與印刷設定檔而異,此處顯示的是從畫面 sRGB 計算出的近似值。CMYK 不接受作為輸入格式。
所有轉換都在您的瀏覽器內進行,輸入的值不會傳送到外部伺服器。
相關工具
QR Code 產生
將 URL / 聯絡人 / Wi-Fi / 郵件 / 活動 / 地理座標 / SMS / 電話 / 文字轉換為 QR Code 影像。可選尺寸、格式、顏色與 Logo。全程在瀏覽器中完成。
抽籤 / 抽獎
從文字清單或數值範圍中隨機抽出 1~N 項。支援不重複、捲動動畫、抽籤歷史保存。全程在瀏覽器中完成。
色彩選擇器
從圖片中擷取顏色並取得色碼。可透過放大鏡依像素精準拾取,支援 HEX / RGB / HSL 切換與調色盤匯出。全程在瀏覽器中完成。
對比度檢查
可即時計算前景色(文字色)與背景色對比度的免費對比度檢查工具。依 WCAG 2.1 / 2.2 的 AA、AAA 標準(一般文字、大型文字、UI 元件)判定是否合格,並支援自動建議合格色、色覺異常模擬與 APCA。配色的無障礙程度全程在瀏覽器中即可確認。
番茄鐘
免費的線上番茄鐘,依 25 分鐘專注加 5 分鐘休息的節奏循環。支援環形進度條、提示音、全螢幕模式以及永遠置頂的子母畫面(小視窗彈出),適合用作學習與工作的專注計時器。全程在瀏覽器中完成。
單位換算
可在長度、重量、溫度、面積、體積、速度等各種單位之間相互換算的免費單位換算工具。支援長度換算、重量換算、溫度換算(攝氏與華氏),以及 cm 與英吋、坪與平方公尺等即時換算。全程在瀏覽器中完成。
色碼轉換是什麼?
色碼轉換是一款可在 HEX、RGB、HSL、HSV、OKLCH 各格式之間互相轉換的工具。只要輸入一個顏色,就會同時計算並列出所有對應格式的表示法,且各個值都能一鍵複製。從 HEX 轉 RGB(hex rgb 轉換)、RGB 轉 HEX、HSL 轉換到 RGBA 轉換,Web 與設計製作所需的各種轉換都能一併完成。
輸入時不需要先選擇格式。像 #1E90FF 這樣的 3 位、6 位 HEX、含透明度的 4 位、8 位 HEX(8 位色碼轉換)、rgb(30, 144, 255) / rgba(30 144 255 / 0.8)、hsl(210, 100%, 56%) / hsla(...)、hsv(...)、oklch(0.65 0.19 253) 等都可以直接貼上,工具會自動判別格式並轉換。您也可以透過原生顏色選擇器挑選顏色,或以透明度(Alpha)滑桿在 0~1 的範圍內調整不透明度。
輸出內容也包含近年在 CSS 中應用日漸普及、感知上均勻的色彩空間 OKLCH,以及印刷使用的 CMYK 參考值。當您需要在 HEX、RGB、HSL、HSV 之間來回切換,並在設計稿、CSS、設計工具之間精準傳遞同一個顏色時,這款工具相當實用。
所有轉換都在您的瀏覽器內進行,輸入的值不會傳送到外部伺服器。無需註冊帳號、也不必點擊廣告,立即就能使用。
使用方法
- 在輸入框貼上色碼(會自動判別 HEX、RGB、HSL、HSV、OKLCH)。您也可以透過右側的顏色選擇器挑選顏色。
- 想改變透明度時,以 Alpha 滑桿調整不透明度(0~1)。
- 在預覽中確認目前的顏色(含透明度)。
- 從「轉換為各格式」列表中,確認 HEX、8 位 HEX、RGB、RGBA、HSL、HSLA、HSV、OKLCH、CMYK 的值。
- 透過各列的「複製」按鈕,複製所需格式的值並加以運用。
使用情境
- 想把設計稿的 HEX 改寫成 CSS 的 rgb()/rgba() 的 Web 設計師、切版人員。
- 想以 8 位 HEX 或 rgba 精準指定含透明度顏色的前端工程師。
- 想以 HSL 或 HSV 調整色相、飽和度、明度,並取得最終 HEX 的使用者。
- 想以 OKLCH 設計感知上均勻的配色,並確認對應 RGB/HEX 的設計師。
- 想將畫面上的顏色,以 CMYK 參考值作為印刷概略依據掌握的使用者。
- 想在多個工具或程式碼之間,將同一個顏色轉換成不同格式來傳遞的開發者。
注意事項
- 可接受 HEX、RGB、HSL、HSV、OKLCH 作為輸入格式。CMYK 用於印刷,會依色域與設定檔而異,且無法從畫面的 sRGB 唯一逆轉換,因此僅支援輸出(參考值)。
- 支援 8 位 HEX(#RRGGBBAA)與 4 位 HEX(#RGBA)、rgba()、hsla(),以及 `oklch(L C H / a)` 的透明度。透明度也可透過 Alpha 滑桿調整。
- 由於原生顏色選擇器無法處理透明度(僅 6 位 HEX),即使用選擇器挑選顏色,目前的透明度仍會被保留。
- HSL、HSV、CMYK、OKLCH 會四捨五入為整數或固定小數位數顯示,因此再次轉換時可能產生極微小的誤差。
- 從 OKLCH 轉換為 RGB 時若超出 sRGB 色域,會將其四捨五入(clamp)至可顯示的範圍內。