計資中心電子報C&INC E-paper

作者：湯雅甯 / 臺灣大學計算機及資訊網路中心程式設計組行政專員

---

覺得色彩配色困難、不知道自己美感在哪裡、總是收到一些奇怪的主題設計需求？過去需要有色彩學基礎和大量的配色練習，現在AI配色工具可以提供更直覺的選項。

 

色彩選擇器

先瞭解三個關於色彩的基本原理，以便理解色彩選擇器如何調整。

1. 色相Hue：色彩的種類，像是：紅色、綠色、藍色……等色彩的名稱。
2. 明度Value：色彩的明暗程度，表示深淺，像是：淺粉紅色、深紅色、淺咖啡色、深咖啡色……等。
3. 飽和度Saturation：色彩的純度，通常色彩越鮮豔飽和度就越高，色彩越混濁飽和度就越低。
   網址：https://zh-tw.rakko.tools/tools/30/

圖1：色彩選擇器

 

以下三個AI配色工具，不需要用到相近色、對比色、互補色等色彩學理論或是色彩心理學，只需要輸入關鍵字或是選擇關鍵色彩可以立即獲得配色組合，並且可以依照自己的需求調整應用。

 

配色師

使用OPEN AI技術開發，友善的中文介面，輸入產業或品牌類型和想要的風格與情境，根據需求產生5組色彩組合，提供的描述越詳細，色彩也會越精確，免費版每日有限次數使用。

網址：https://colorist-ai.com/

 

圖2：配色師

 

圖3：配色參考-1

 

圖4：配色參考-2

 

圖5：配色參考-3

 

圖6：配色參考-4

 

AI Color

輸入關鍵字（中文亦可）會產生1組色彩組合，可選擇Mobile app、Dashboard、Portfolio、Landing Page等模式預覽配色，也可以針對特定色彩進行調整並即時預覽結果。

網址：https://aicolors.co/

 

圖7：Dashboard配色

 

圖8：Mobile app配色

 

圖9：針對特定色彩進行調整

 

PaletteMaker

提供色彩隨機配對以及可直接調整主要色彩，再加上多種設計模板：UI設計、品牌LOGO、插畫、排版、海報、圖案設計等配色示意圖，對設計配色相當友善。

網址：https://palettemaker.com/app

 

圖10：選擇設計模板進行配色預覽

 

圖11：調整特定色彩進行預覽

 

圖12：更多配色建議

 

結語

常見的專業配色工具像是Adobe color調色盤產生器、Colour code尋找相近色、對比色及互補色選項，Eva Design System選擇主色即可自動生成其他語意色彩，Design.ai的Color Matcher也有提供無障礙設計的色彩對比率，以上幾個配色工具也都非常實用。

ChatGPT、Copilot、Gemini也可做到利用關鍵字詞產生色彩組合和生成mockup示意圖，但需要更多的指令或是詠唱咒語做調整才能達到合適的效果。

使用AI配色工具拯救色彩靈感之外，利用簡單的示意圖幫助配色溝通進而提升設計美感。

 

圖13-其他配色工具

 

相關連結及參考資料

1. 顏色選擇器：https://zh-tw.rakko.tools/tools/30/
2. 配色師：https://colorist-ai.com/
3. AI Colors：https://aicolors.co/
4. PaletteMaker：https://palettemaker.com/app
5. Adobe Color：https://color.adobe.com/zh/
6. Colour code：https://www.toptal.com/designers/colourcode/quad-color-builder
7. Eva Design System：https://colors.eva.design/
8. Design.ai Colors：https://designs.ai/colors