🎨 ColorConverter

EN

🎯 配色方案

🕐 最近使用的顏色

🔄

即時互轉

HEX、RGB、HSL 三種格式即時轉換，輸入任一格式自動計算其他兩種。

🎨

視覺選色

內建顏色選擇器，直覺選色，即時預覽大面積色塊效果。

🎯

配色方案

自動產生互補色、類似色、三等分、分裂互補等專業配色方案。

📋

一鍵複製

每種色碼格式旁都有複製按鈕，快速複製到剪貼簿使用。

🕐

歷史記錄

自動記錄最近使用的顏色，方便快速回顧與重複使用。

🔒

完全離線

所有計算在瀏覽器完成，不需要網路連線，資料不會上傳。

相關文章

色彩模型解析：RGB、HSL、HEX 完整介紹

深入了解 RGB、HSL、HEX 等色彩模型的原理與差異。掌握不同色彩空間的運作方式，讓你在設計與開發中精準控制顏色。

入門指南

設計師必懂的色彩理論：從色環到配色方案

色彩理論是設計的基石。從伊登色環到現代配色系統，一篇掌握設計師必備的色彩知識與實用配色技巧。

設計理論

無障礙色彩對比指南：符合 WCAG 標準的配色方法

了解 WCAG 色彩對比度標準，學會如何選擇符合無障礙規範的配色，讓你的網站對所有使用者都友善。

無障礙設計

色彩心理學與品牌設計：用顏色說故事

不同顏色會引發不同的情緒反應。深入了解色彩心理學在品牌設計中的應用，選出最能傳達品牌精神的配色。

品牌設計

常見問題

HEX、RGB、HSL 有什麼差別？
HEX 是 16 進位色碼（如 #FF5733），常用於網頁 CSS。RGB 用紅綠藍三原色數值（0-255）表示。HSL 則用色相、飽和度、亮度表示，更直覺地調整顏色。
什麼是互補色？
互補色是色相環上相距 180° 的兩個顏色，放在一起對比強烈、視覺衝擊力強，常用於設計中需要突出的元素。
如何選擇好看的配色方案？
可以使用本工具的配色方案功能。類似色方案較和諧柔和，互補色方案對比強烈，三等分方案色彩豐富又平衡。根據設計目的選擇合適的方案。
歷史記錄會保存多久？
歷史記錄存在瀏覽器的 localStorage 中，除非您手動清除或清除瀏覽器資料，否則會一直保留。
支援透明度（Alpha）嗎？
目前支援標準的 HEX（6 位）、RGB、HSL 格式。如需帶透明度的色碼，可以手動在 HEX 後加兩位（如 #FF573380）或使用 rgba() 格式。