# 色碼轉換器

URL: https://tools.otaku-dojo.com/zh-tw/color-converter
Updated: 2026-10-03

色碼轉換器接受任何 CSS 顏色寫法（#3a4fd8、rgb(58 79 216)、hsl(233 67% 54%) 或 tomato 這類顏色名稱），立即轉換成 HEX、RGB、HSL、HSV 與 CMYK，並計算這個顏色和白色、黑色的 WCAG 2.1 對比度，告訴你當作文字或背景時是否達到 AA / AAA 無障礙標準。

## 如何使用色碼轉換器

1. 在「顏色」欄位輸入任一格式的色碼，或用下方的取色器挑選。
2. 右側即時顯示色塊與各種格式的色碼。
3. 查看「對比度」判斷配白字或黑字是否清楚。
4. 按「複製」取得全部格式。

## 規格與重點

- **輸入格式**: HEX（3/4/6/8 位）、rgb()、hsl()、CSS 顏色名稱，以及瀏覽器支援的其他 CSS 色彩
- **輸出格式**: HEX、RGB、HSL、HSV / HSB、CMYK
- **對比度**: WCAG 2.1 相對亮度公式，對白色與黑色
- **透明度**: 支援 alpha，輸出 8 位 HEX 與 rgba()
- **CMYK 說明**: 以數學公式換算，未套用印刷色彩描述檔
- **處理位置**: 你的瀏覽器

## 範例: HEX 轉 RGB 與 HSL

```text
#e2502c
```

→

```text
RGB: rgb(226 80 44)
HSL: hsl(12 76% 53%)
CMYK: 0%, 65%, 81%, 11%
```

## 常見問題

### HEX 和 RGB 有什麼關係？

HEX 是用 16 進位表示的 RGB：#e2502c 中的 e2、50、2c 分別是紅 226、綠 80、藍 44。

### 轉出來的 CMYK 可以直接拿去印刷嗎？

只能作為參考。實際印刷顏色取決於紙材與印刷廠的色彩描述檔（ICC profile），重要的印刷品請以印刷廠提供的色票確認。

### HSL 的三個數字代表什麼？

H 是色相（0–360 度色環）、S 是飽和度、L 是亮度。調整 L 就能做出同色系的深淺變化，很適合設計 hover 色。