身為一名平面設計師,無論是在做品牌識別設計、行銷素材或是繪製插畫,都可能遇到配色難題,配色可以說是設計的成敗關鍵!憑感覺配色是一種方式,但有時候照著感覺走,容易遇到配色好像哪裡怪怪的,但又說不出哪裡怪的窘境,這時候配色網站就會是設計師的得力助手!以下整理 15 個好用的配色網站,歡迎大家依據需求服用!
配色網站推薦:Adobe Color
Adobe Color 是 Adobe 開發的配色網站,專業度高且功能非常完善。網頁左邊就能選擇常見的色相環配色方法,也能上傳喜歡的照片將照片中的配色擷取下來。色號也能直接存進 Adobe 資料庫,方便設計師整合。

配色網站推薦:Colordot
Colordot 是款自由度更高的配色網站。只靠鼠標就能直覺配色,剛開始只給你空白頁面,只要在上面移動滑鼠就能隨時調整配色。游標水平方向是調整色相,垂直方向是調整明度,滾輪則是調整彩度,按下滑鼠後就能固定顏色並提供色號。

配色網站推薦:CSS Gradient
CSS Gradient: 如果你的配色需求是漸層,可以使用這個配色網站,提供線性、放射等不同漸層表現方式,並且會顯示 CSS 代碼,方便使用者在網站上使用這些漸層色。

配色網站推薦:OddContrast
OddContrast: 展示文字在背景上的配色網站,使用上很單純,只需要選擇兩種配色:背景色與文字顏色,可以快速判斷不同的色彩搭配是否有足夠易讀性。

配色網站推薦:Canva color
Canva color: Canva 內建的色彩工具,總共有四款工具可以使用,包括從既有照片中擷取配色靈感、參考現有的配色組合、色相環配色以及瀏覽不同顏色代表的意義。

配色網站推薦:Colorhunt
Colorhunt: 介面直覺、好操作,點擊進入配色組合,會有更詳細的色彩資訊。可以直接將喜歡的配色組合儲存成圖片,或是將配色組合存成網頁連結,方便往後使用。

配色網站推薦:Color Supply
Color Supply 也是個相當方便的配色小工具網站。基於色相環配色,能快速選出上述提及的配色方法,風格可愛,功能單純,可以看到選擇的配色套用在圖像上的效果。

配色網站推薦:Color Mind
Color Mind: 一次產出 5 種顏色的配色,點擊 Generate 可以產出新的配色,更棒的是可以直接預覽五種配色用於網頁、圖表等 UI 中的樣子。

配色網站推薦:Color Drop
Color Drop: 網站首頁列出許多熱門配色,也能自己搜尋關鍵字,找到符合關鍵字的配色組合。點選配色下方的「 眼睛 」圖示,可以看到完整的顏色資訊,每種顏色還有專屬名稱,非常可愛。

配色網站推薦:Color Lisa
Color Lisa: 收錄全世界知名藝術家的配色清單,包含畢卡索、達文西、莫內等,讓你的配色組合更有藝術氣息。

配色網站推薦:Brand Colors
Brand Colors: 提供全球各大品牌的配色組合,按照品牌字母依序排列,也可以手動搜尋。一樣點擊就可以複製色號。

配色網站推薦:Coolors
Coolors: 只要按下鍵盤的空白鍵,Coolors 就會隨機提供五種顏色的配色組合。也可以鎖定特定顏色,更換其餘的色彩組合。

配色網站推薦:ColPat
ColPat: 一款強大的 AI 配色軟體,可以直接透過 AI 推薦配色,也有擷取照片中的顏色、漸層色配色等功能,還有很可愛的色彩心理學知識科普,算是功能很完善的配色網站。

配色網站推薦:Paletton
Paletton: 介面充滿科技感,色彩資訊也很完整。選擇不同配色時,右邊會出現相近色的配色方案,讓使用者有更多搭配組合。

配色網站推薦:ColorHexa
ColorHexa: 輸入特定色號,會提供該顏色非常完整的顏色訊息,包括不同色值的轉換、色調變化以及配色建議⋯⋯等等。

設計師最推薦的配色網站
配色網站提供各種情境與關鍵字的配色方案,讓你能快速參考現有配色、從中獲得靈感。也能直覺地變更顏色,進行顏色預覽和調整,配色網站也通常會展示最新的色彩趨勢和流行色,設計師可以確保使用的配色符合潮流。
在這 15 個配色網站中,我最常用的是 Adobe Color ,因為功能非常完善,可以應付我不同情境的配色需求,與 Adobe 串接也讓我的工作流程更連貫。如果你不是設計專業人士,其他網頁像是 Colordot、Colorhunt 操作上則是更簡單、直覺,也很推薦。
延伸閱讀:
- 自學平面設計,你需要這些軟、硬實力、排版設計好難?六個實用的 IG 文字排版設計技巧
- 【 Ps 製作 GIF 檔 】用時間軸讓圖片動起來!
- 【 Ai 立體字】快速製作卡通效果的的綜藝字體
- 印刷時該怎麼選紙?不可不知的紙張知識
- 平面設計接案 7 大地雷和報價行情攻略!
- 設計師的好夥伴 – 【BenQ PD2705U 專業設計繪圖螢幕】開箱超完整使用心得