易口袋Pockez
配色產生器
免費線上配色產生器：在色環拖曳選色，自動推薦互補、類似、三等分配色，多組色票並排比較、檢查 WCAG 對比度，可下載色票圖與分享。
- 自動推薦配色
- 多組色票比較
- WCAG 對比度
- 下載與分享
在色環上拖曳：繞圈選色相、往外拉更鮮豔。點下方色票的色塊，切換要調整的顏色。
推薦配色
依目前顏色產生。點色塊加入目前這組，或整組建立成新色票。
這是灰階色，沒有色相可旋轉；往色環外圈拖一點，推薦會更有變化。
我的色票
並排比較
對比度檢查（WCAG）
列為文字色、欄為背景色。一般文字需達 AA（4.5:1），大字需 3:1。
匯出 CSS 變數
🔒 所有計算都在你的瀏覽器內完成，資料不會上傳到任何伺服器。
使用說明
- 點色票裡的色塊選擇要調整的顏色，在上方色環拖曳：繞圈改色相、往外拉更鮮豔，下方滑桿調亮度。
- 「推薦配色」會依目前顏色產生互補、類似、三等分等配色，點色塊加入色票，或整組建立成新色票。
- 在「並排比較」看哪組配色合適，用「對比度檢查」確認文字是否易讀，最後一鍵匯出 CSS 變數。
常見問題
推薦配色是怎麼產生的？
依色彩學的經典配色規則，在色環上旋轉目前顏色的色相：互補色轉 180°、類似色左右各 30°、三等分每 120°、四方每 90°；單色深淺則保持色相、改變明暗。
什麼是 WCAG 對比度？
WCAG 是國際網頁無障礙規範。文字與背景的對比度一般文字至少 4.5:1（AA）、大字至少 3:1，達 7:1 為最高的 AAA 等級。
可以直接貼上品牌色碼嗎？
可以。色塊旁的欄位支援貼上 #RRGGBB、#RGB、rgb()、hsl() 與 CSS 色名（如 tomato），會自動轉成 HEX。
色票會被儲存嗎？
色票只存在你這台裝置的瀏覽器中，下次打開還會在；不會上傳到伺服器。