你的配色之所以亂，是因為沒搞懂這個！

兄弟們

姐妹們！

天氣越來越熱，我宣布夏天來了！！

GIF/966K

之前有粉絲問我，說自己的配色很亂，看網上的一些大神做的圖配色特別舒服，總是找不到原因。現象後背必有規律，今天的文章就是解決這個問題。

在色彩概念里最能改變色彩印象的就是色調

色調就是色彩的明度和飽和度的組合，色調決定了畫面的基調和氛圍。

無論你在畫面中用了多少種顏色，只要色調（明度和飽和度）統一，就自然可以形成和諧的配色效果。

下面正式進入

配色裝逼大法第二部——協調的配色

下面說下電商設計中最常見的2個配色方案。

▌配色協調方法一

不同色相搭配，把不同色彩的亮度和飽和度調成一致或者近似，這是最基本的配色原則。

▌配色協調方法二

同一色相搭配，只調該顏色的亮度和飽和度，也能達到和諧的效果。

看來無論是用哪種配色方法咱們都先必須搞清色相，亮度和飽和度（HSB模式）。

你只要理解了這三個屬性，那麼即使不用太深了色彩知識，也能實現有效的配色。

假如你不懂HSB，那你廢了…

沒關係， 幸虧你看到了這篇文章 ，下面開始裝逼。

HSB分別代表，色相，明度，飽和度。

色相就代表具體某個顏色，紅色綠色等等全部統稱為色相。下面這個環也叫色相環。

飽和度就是色彩的鮮艷程度，顏色飽和度最高的就是純色。拾色器最右側的顏色皆為飽和度最高，反之左邊就是最低。

明度就是該顏色的明亮程度，在拾色器中最上端的位置的選色皆為明度最高的，反之最下端就是明度低的。

由此可見一個顏色有兩個可以調節的選項，分別是飽和度和明度。

下面咱們先使用第一個配色方法把不同色彩的亮度和飽和度調成一致或者近似。

為方便大家理解，我從素材網上下載了一個海報做講解。

大家看下這個海報顏色用的比較混亂，略有花哨，用了一些漸變和投影，每個顏色的飽和度與明度大都不一致。

然後我在不改變排版構圖的情況下，對顏色進行了調整，刪掉多餘的視覺噪點顏色，統一了各個色彩的飽和度和明度，文案周邊增加了暗色，做了一個明度對比突出主信息，加了一個冷暖對比這個後續的文章會講。

色調統一之後，純度和明度差都很小，所以給人感覺比較舒服協調。（看下面的H差值較大，所以必須將S值和B值調整相近）

下面講下第二種配色，同一色相配色，要拉開該顏色的亮度和飽和度。這種配色方法天貓的官方系列活動海報體驗的淋漓盡致。

這類海報中基本只有一種主色相的配色，因為畫面色相統一，為了體現畫面的層次和張弛效效果，所以背景配色上都適當增加飽和度和明度的差值，同一色系的深淺搭配來突出視覺。

最後總結，當不同色相搭配的時候，要把飽和度和明度調為一致。當色相為同一色相或者色相相近的時候，要將飽和度和明度值拉開。

後面會為大家帶來配色裝逼大法第三部。

本文本來打算前天發的，誰知花瓣崩潰了兩天…結果現在才發…

—————end—————

超100000+電商美工已經關注！

沒靈感沒創意就關注超級美工！

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！