零經驗也適用！最萬能的顏色配色技巧，結合配色網站更強大！
顏色好多到底哪個好看？顏色配來配去一直重複？配色網站好麻煩不會操作？請用這一招配色技巧，馬上讓你事半功倍！
透過色彩
Arenski／一看就懂配色設計
讓你的設計會說話
想做好一個平面設計，除了字體、圖片、排版之外，更重要的就是配色。你相信顏色有影響情緒的能力嗎？這個現象跟「色彩心理學」有關[1]，在《一看就懂配色設計》一書中，特別提及顏色對於情緒有一定的影響力，舉例來說：白色會感到乾淨；藍色會感到涼爽；紅色會感到熱情。因此每次設計出的作品，都要根據不同情境，來選擇最合適的配色，透過顏色引導，營造出特定氛圍。現在也有滿多好上手的配色工具可以協助初學者，像是 Coolors 配色網站，就提供了相當好用的免費功能，如：快速產色、圖片抓色、漸層色版、色盲檢測、儲存顏色……等。
解鎖實用工具
馬上解鎖設計與行銷的實用資源清單！專為設計師和行銷人員打造，精選出多達數十種設計工具與行銷工具，立即點擊下方按鈕解鎖查看！
色彩學入門知識
提到配色，還是必須要簡單認識一下，色彩學入門知識「色環」。色環英文是 Color Wheel ，為色彩學的工具之一，是將可見光區域的顏色以圓環作呈現，又可稱為「色輪」或「色圈」，其中包含 12 種不同顏色，因此又有「十二色色環」之稱[2]。以此為基礎，衍伸出不同的配色模式，主要可區分以下幾種：
(1) 單色配色法
單色配色法（Monochromatic Colors）是基於同一種顏色的不同色調和亮度來進行配色。這種配色法通常可以營造出統一且和諧的氛圍，乾淨簡約卻又不會太無趣。
(2) 互補色配色法
互補色配色法（Complementary Colors）是選擇色環正對面的兩種顏色。這種配色法具有強烈反差感，可創造生動活潑的效果，不過使用時應避免用於文字，以防看不清楚。
(3) 相似色配色法
相似色配色法（Analogous Colors）是指色環上相鄰的三種顏色。此方法為多了一點變化性的單色配色法，使用時建議挑選其一為主色，其餘顏色為輔助色，否則顏色太相似會看不到重點。
(4) 三角配色法
三角配色法（Triadic Colors）又稱為「三等分配色法」，即是於色環上繪製出三角形而成的三種顏色。此種配色法可有效讓顏色達到平衡，同時富含戲劇張力，一樣建議擇一為主色，其餘顏色為輔助色，以避免畫面過於雜亂。
(5) 矩形配色法
矩形配色法（Tetradic Colors）又稱為「矩陣配色法」，即是於色環上繪製出方形而成的四種顏色。此配色法是由兩組互補色組成，同時包含冷暖色調，所以使用前應了解主體的冷暖設定，並降低非主色的飽和度，確保視覺平衡。
配色技巧：擷取圖片顏色
請花 30 秒給我一組包含 3 個顏色的「夏天配色」。夏天是什麼顏色？藍色？然後呢？沙灘？你腦海是不是閃過各種情境要素？然而時間已經超過了……。
如果「單靠印象」來做設計，思考就容易受到限縮，導致碰壁。配色技巧的核心重點，就是透過網路或使用 Pinterest 搜尋圖片配色靈感，並依據圖片上的要素，來選擇適合的顏色。因為顏色的功用在於營造氛圍，而圖片已經幫我們完成這件事，當我們了解這個原則之後，即可藉由搜尋來完成配色。如果這對你來說還是太困難，那 Coolors 配色網站的圖片抓色功能，可以完美地幫助你。除此之外，本篇文章最後還有補充 18 組配色實例，提供大家參考。
配色網站：參考顏色搭配
在開始設計專案前，可藉由配色網站來進行顏色模擬搭配，讓配色能更精準。不過配色網站的操作，也有難易之分，對於初學者而言，建議優先使用 Pinterest，尋找配色靈感，快速又容易。對於進階者而言，可以選擇好上手且功能齊全的 Coolors；專業性高的 Adobe Color；操作簡易的 Canva。
Coolors 配色網站
Coolors 是一款非常好上手的配色網站，提供快速配色產生器，「按一下空白鍵」即可獲得無限種配色，同時搭配鎖定、刪減、微調功能，直到找出期望配色[3]。Coolors 支援多種色碼 RGB、CMYK、LAB、HSB，以及超多免費顏色工具，像是：擷取圖片顏色、製作漸層色版、色盲模擬檢測、儲存喜愛顏色……等。你不只能在電腦網頁版上使用，還可下載手機版應用程式，讓你隨時隨地玩出新色彩，既快速又方便，絕對值得立即體驗。
Coolors 優點
Coolors 對於初學者相對友善，操作介面直覺簡單，快速上手，省下大把學習時間。配色工具免費又齊全，充分滿足大部分設計使用上的需求。
Coolors 缺點
Coolors 雖然為英文介面，不過大多數功能皆以圖示取代，初學者可不用擔心。另外，少部分進階功能需額外付費解鎖，需要者可視情況升級。
Adobe Color 配色網站
Adobe Color 來自 Adobe 系列[4]，前身名稱為 Adobe Kuler。作為一款專業線上顏色配色網站，Adobe Color 不僅完全免費使用，還提供中文介面，而且線上製作的色票，還可透過「資料庫」功能，直接匯入其它系列軟體，如：Photoshop、Illustrator、InDesign，以及 Adobe Express 線上排版網站。另外，網站本身也有「探索」和「趨勢」功能，藉由 Adobe 本身龐大的資料數據，推薦你其它配色參考，或時下流行顏色，相比其它配色網站，使用體驗將會大幅提升。
Adobe Color 優點
Adobe Color 具全中文介面，不只提供專業配色工具，更利用自身品牌優勢，建構出一套完整配色系統。你還可透過內建「擷取主題」功能，抓取圖片主要配色，來生成色票，以及使用「協助工具」，進行顏色檢測，讓一般用戶或色盲患者獲得最佳體驗。
Adobe Color 缺點
Adobe Color 同樣有著專業軟體的通病，那就是必須具備基礎的配色知識才可完全上手，不過還是有容易上手的部分，如優點所提到的「擷取主題」功能。此外，部分功能要訂閱或購買 Adobe 系列軟體才可解鎖，但對於一般使用者免費版已足夠使用。
Canva 配色網站
Canva 成立於 2012 年[5]，品牌本身主打的是線上排版軟體工具，因此衍伸出其它附加功能，如：Canva 配色網站、Canva 素材圖庫……等，可稱之為簡易版的 Adobe 系統。Canva 配色網站目前只有英文介面，對於英文苦手比較吃力，建議搭配翻譯使用。網站除了具備基本配色工具之外，也包含配色靈感可以參考，還提供擷取主題顏色功能，可以快速抓取色票。特別的是，你可以在網站學習顏色知識，了解顏色的意涵，以及顏色如何影響情緒。
Canva 優點
Canva 專門提供給「非完全體」用戶，是個適合學習設計的地方。配色系統點到為止，不會過於艱深難懂，可搭配內建排版軟體，利用套版功能直接排版出一個海報設計或平面設計作品。
Canva 缺點
Canva 只有英文介面，尚未支援中文。在操作功能上，相比其它專業網站較為陽春，無法執行細節調整，自由度受限，難以發展高專業性操作。但對於初學者而言，以達到配色參考目的。
（訂閱最新文章，並追蹤 Facebook）
配色推薦：節日顏色應用
不管你是設計師還是行銷專員，每年總是會碰到各種節日，是不是又再擔心這次的設計該如何配色？配來配去又跟去年相似，除了學習運用配色網站之外，以下特別補充 18 組常見節日的顏色配色推薦，讓剛入門的初學者有快速參考的範例。同時分享一個實用的中文素材管理工具 Eagle，它可在瀏覽網頁時直接儲存喜愛的配色，是眾多設計師的必備工具之一。
(1) 新年配色
新年（New Year）為每年的 1 月 1 日，對於亞洲文化來說，還可再細分出農曆新年，俗稱「過年」[6]。新年常見的顏色配色要素為紅包的紅色及金元寶的金色，有著喜氣與財富的意象。各國都有著跨年文化，每年的 12 月 31 日晚上，會放煙火慶祝過完一年，因此可以選擇的顏色更廣，其中包含紅色、橘色、綠色和藍色……等，夜晚建議改以深藍色取代，避免直接使用黑色，導致過於陰暗。
(2) 元宵節配色
元宵節（Lantern Festival）為農曆年的 1 月 15 日，又稱為「上元節」，是農曆新年的第一個月圓日[7]。傳統習俗會在這天進行與「燈」有關的活動，例如：提燈籠、猜燈謎、放天燈……等，緣由是古時候的這天，老師會幫學生點燃燈籠，象徵前途光明，流傳至今。元宵節主要的顏色配色為燈籠的紅色搭配華麗鑲邊的金色；另外，因放天燈的習俗，還可使用火焰的橘色與夜晚的深藍色。
(3) 情人節配色
情人節（Valentine’s Day）為每年的 2 月 14 日，因情人節種類眾多，此處就以西洋情人節為代表[8]。愛情的代表色為紅色，因此情人節的顏色配色主要圍繞在紅色系，如：愛心的紅色、玫瑰的紅色、蝴蝶結緞帶的粉紅色，甚至還可加入求婚戒指的金色或紅酒瓶的黑色，來增加顏色變化性。
(4) 母親節配色
母親節（Mother’s Day）為每年 5 月的第二個星期日，由美國國會於 1913 年所訂下的日期[9]，發起人為安娜．賈維斯（Anna Jarvis），其母親最愛的花為康乃馨，故康乃馨便成為母親節的代表花。母親節的顏色配色，除了使用康乃馨花朵的粉紅色或紅色之外，康乃馨葉子的綠色也可作為搭配顏色之一，更可嘗試使用母親呵護小孩的意象作為顏色的選用，如：皮膚的米色。
(5) 端午節配色
端午節（Dragon Boat Festival）為農曆年的 5 月 5 日，又可被稱為「詩人節」，為紀念古代詩人屈原於此日投江自盡[10]，常見的習俗活動有吃粽子、划龍舟……等。端午節顏色配色可選擇粽子竹葉的綠色、糯米的米色以及紅棗的紅色，亦可使用划龍舟作為選色要素，如：龍舟的深藍色或比賽場地河川的淺藍色。
(6) 父親節配色
父親節（Father’s Day）為每年的 8 月 8 日，因諧音的緣故，因此又被稱為「爸爸節」[11]。父親節的顏色配色可以選擇父親常使用的用品作為顏色要素，例如：皮鞋的褐色、領帶的藍色、手錶的銀色、眼鏡的黑色……等。另外，父親有著身材壯、力氣大的印象，所以常被聯想為超人，故可使用紅色與藍色，作為配色之一。
(7) 中秋節配色
中秋節（Mid-Autumn Festival）為農曆年的 8 月 15 日，為秋季的第二個月，又可稱為「月夕」[12]。此時的月亮又大又圓又亮，所以有著賞月或吃月餅的習俗。中秋節的主要顏色配色與月亮息息相關，如：月亮的黃色、月兔的白色、月餅的米色、月餅內餡的褐色。除此之外，這天還有著一邊烤肉一邊團圓的習慣，還可挑選與食材相關的顏色，可讓整體視覺更加豐富。
(8) 萬聖節配色
萬聖節（Halloween）為每年的 10 月 31 日，是來自西方的傳統節慶[13]，在當天的夜晚稱為「萬聖夜」，此時小朋友會變裝打扮，提著籃子跟鄰居要取糖果，並大聲喊著：「不給糖就搗蛋（Trick or Treat）！」。萬聖節的顏色配色與鬼怪相關，如：南瓜怪的橘色、烏鴉的黑色、科學怪人的綠色、狼人的褐色、月亮的黃色……等，讓整體視覺營造出詭異的氣氛。
(9) 聖誕節配色
聖誕節（Christmas），為每年的 12 月 25 日，又稱為「耶誕節」[14]。聖誕節的顏色配色，是由幾種要素組構而成，例如：聖誕老人服裝的紅色、聖誕老人鬍子的白色、聖誕樹與槲寄生的綠色、薑餅人的米色、拐杖糖的紅白色……等，但由於這幾種顏色太常見，了無新意，因此若想多點變化，可以考慮使用星星的黃色與夜晚的黑色，營造出黑暗中帶點溫暖的感受，讓設計跳脫傳統框架。
創造一個好看的顏色搭配
配色在設計中是非常重要的一環，不同的顏色會影響不同的情緒。在《一看就懂配色設計》書中，特別針對「顏色知識」、「配色規則」、「實例演示」三大項，由淺入深進行教學，非常適合剛入門的初學者閱讀。如果你想直接進行實操，可以根據自身經驗挑選適合的顏色搭配網站，例如：參考配色的 Pinterest；快速上手的 Coolors；專業介面的 Adobe Color；功能單純的 Canva。不過最重要的還是學會分析要營造的氛圍，並從中擷取圖片顏色，這才是最萬用的配色技巧。你準備好了嗎？下次試試看吧！
常見問題
從何開始學習色彩配色？
你一定要先學會「看懂顏色」！在《一看就懂配色設計》書中，強調色彩知識的重要性，並提供 15 種配色模式參考，專為初學者設計，從 0 到 100，一本書完整搞定！
免費好用色彩搭配網站推薦？
色環配色法有哪幾種？
色環配色法可分為五種：單色配色法、互補色配色法、相似色配色法、三角配色法、矩形配色法。
燙金色色號（假金）CMYK 數值？
不做後加工，直接印刷的「金色」，被稱為「假金」。有此需求的設計師，可以使用金色色號「C20 M30 Y85 K5」。
Pantone 色票是什麼？
鼎鼎大名的 Pantone 色票是什麼？Pantone 中文名稱為「彩通」[15]，為一家全球聞名的色彩系統供應商，替每個顏色編上專屬色號，而這些色號又可稱為「色票」。
莫蘭迪色卡的由來？
源自 20 世紀畫家喬治．莫蘭迪（Giorgio Morandi）[16]，其擅長靜物畫，並採用低飽和度和灰色調的顏色作畫而聞名。這些顏色的色卡，被後人稱為「莫蘭迪色卡」。
配色英文是什麼？
配色英文是 Color Matching。
色彩計畫英文是什麼？
色彩計畫英文是 Color Scheme，係指配色的整體規劃及使用方針。
[1] 資料來源：色彩心理學（維基百科）
[2] 資料來源：色環（維基百科）
[3] 資料來源：What is Coolors（Coolors）
[4] 資料來源：Adobe Creative Cloud（Wikipedia）
[5] 資料來源：Canva（維基百科）
[6] 資料來源：新年（維基百科）
[7] 資料來源：元宵節（維基百科）
[8] 資料來源：情人節（維基百科）
[9] 資料來源：母親節（維基百科）
[10] 資料來源：端午節（維基百科）
[11] 資料來源：父親節（維基百科）
[12] 資料來源：中秋節（維基百科）
[13] 資料來源：萬聖節（維基百科）
[14] 資料來源：聖誕節（維基百科）
[15] 資料來源：Pantone 彩通（官方網站）
[16] 資料來源：Giorgio Morandi（維基百科）
