十六進制顏色選擇器和調色板轉換器

十六進位顏色選擇器和轉換器(RGB、HSL、HSV)

直接在瀏覽器中將十六進位轉換為 RGB、HSL 和 HSV,複製和聲樣本並匯出 CSS 或 JSON。

輸入#RGB 或#RRGGBB(有或沒有#)。無效值保留最後一次良好的轉換。

轉換

HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217.219, 91.2%, 59.8%)
HSVhsv(217.219, 76%, 96.5%)
和諧樣本
生成和諧顏色
色調/遮光條

導出色板

選擇或貼上十六進位顏色,轉換為 RGB、HSL 和 HSV,產生互補/類似/三元/單色樣本,複製值以及匯出 CSS 或 JSON。免費、快速且完全在您的瀏覽器中運行。

如何使用這個十六進位顏色選擇器

輸入或貼上十六進位值,或使用本機選擇器。該頁面會立即將其轉換為 RGB、HSL 和 HSV,產生和諧色板和色調/陰影條,並使所有內容都準備就緒。使用 URL 共享您的設定 - 狀態儲存在查詢字串中。

十六進位、RGB、HSL 和 HSV 參考

Hex 是一種緊湊的 RGB 編碼。 RGB 描述紅/綠/藍通道。 HSL表示色調、飽和度和亮度; HSV 使用色調、飽和度和明度(亮度)。該工具在瀏覽器中使用確定性數學——無需上傳,也無需外部 API。

互補、類似、三元和單色

補色將色調旋轉 180°。類似的步驟以圍繞您的底座的固定角度進行色調調整。 Triadic 使用 120° 偏移。單色保持色調並改變亮度。計數控制適用於模擬和單色模式。

CSS 變數和 JSON 導出

匯出產生具有穩定名稱的 :root 自訂屬性(例如 --color-base、--color-analogous-1)和帶有 baseHex 的 JSON、和諧模式以及腳本或設計標記的樣本清單。

常見問題解答

#ABC 是否擴展到六位數?

是的。三位數的十六進位按數字對擴展,因此#ABC 變為#AABBCC。

如果我的十六進位無效會怎樣?

您會看到一個內聯錯誤。最後一個有效顏色保留在轉換行、選取器和匯出中,直到您再次輸入有效的十六進位。

和諧色是如何計算的?

它們是確定性的:互補是 HSL 中 180° 的色調偏移;類似地使用固定的色調步驟;三元組使用 120° 偏移;單色改變亮度,同時保持基礎的色調和飽和度。

JSON 匯出中包含什麼內容?

穩定的鍵:baseHex、harmony、harmonyCount(如果適用)、harmonySwatches(十六進位字串)、tintShadeStrip 和 stripCount — 適用於工具或文件。

我可以分享我的顏色嗎?

是的。 URL 會更新十六進位、和聲模式、計數和條帶大小,以便您可以添加書籤或共享準確的設定。