HSB又稱HSV，表示一種顏色模式；在HSB模式中，H表示色相，S表示飽和度，B表示亮度。它對應的媒介是眼睛的感受細胞，因為人眼看到的就是色度、飽和度及明度。千變萬化的色彩，其實是由S和B的不同組合產生的。小編隨意選三個色相，188、20、50，色相如下圖所示：

        從視覺上看，我們很容易看出中間的深橙色跟左右的色彩對比，明顯要暗很多，因為它的飽和度及明度是不同的，3個色相的數值分別如下：

       在設計配色中，想要在視覺上有更舒適的體驗，可以將色相的S值B值稍做調整即可達到目的。如文中例子，提高中間橙色的S值（飽和度）以及它的B值（明度），就可以使三個顏色和諧很多，不妨看下，以下調整后的色彩，感覺不是好多了呢？

       將之應用在設計稿中，視覺效果應該還可以的。當然了，純色組合搭配的方法掌握后，版面設計也是非常重要的一環。

       那么搭配色彩，有什么顏色是“禁區”嗎？當然這里說的“禁區”是帶雙引號的，沒有什么是絕對的禁區，這里的“禁區”只是說顏色在這個區塊不易被控制，在還沒有駕馭好基礎色彩搭配之前，盡量少碰“禁區”的色彩。“禁區”的色彩一般分為三種：三角形禁區、矩形禁區、扇形禁區，如下圖：

      不難發現，不論是哪種，右下角方向的顏色幾乎是很少用的，因為右下角的色彩濃度高亮度低，與其他色彩搭配應用有一種暗淡感，畫面視覺看著不夠通透，在設計中是比較難把控的！當然了，當畫面色彩單一，留白較多，運用拾色器右下角色彩也是可以創作出好看的設計圖，如下圖中畫面非常簡單，字體的顏色使用左側元素的顏色，S值是66，B值30，畫面整體協調統一。這是常用的一種配色方案，使用畫面固有元素的色彩HSB值作為參考，運用到整體中，這樣的配色看起來是非常舒服的：

       掌握了純色組合搭配方法后，可以來學學漸變色的色彩搭配。漸變色，至少是雙色，雙色漸變（線性）單從色相來講，可以大致分為三種：小、中、大。

小雙色漸變

       小漸變就是在色環上，小于30度的兩個色相之間的漸變，專業術語就是同色系漸變，這種漸變色跨度變化很小，比較保守，容易控制、實用頻率很高。

         橙黃色，紫紅色漸變，是使用很頻繁的色彩，譬如雙11購物節，年貨節及促銷活動等，經常都能見到這些暖色調色彩的漸變搭配組合。

中雙色漸變

       中漸變是在色環上大于 30 度且小于 60 度，專業術語叫鄰近色漸變，這種漸變，在色相上有很細膩的變化，看起來更加時尚耐看，比如藍里加點紫、藍里加點綠，橙里加點青或者紅里加點黃等等。

       有很多網頁設計都使用這種漸變方式，因為不會太拘謹，適當放開一些設計效果還是很不錯的。

大雙色漸變

       大漸變在色環上大于 60 度，也可叫撞色漸變（互補色或者對比色），這種漸變視覺沖擊力很強。

        一般來說產品界面里面很少用到，為什么呢？因為視覺沖擊力強是為了吸引眼球，而產品界面主要以內容為主，背景或元素太過搶眼反倒宣兵奪主。反過來說那些宣傳類海報、文章封面、作品包裝等內容確實可以做大膽一點，通過撞色漸變強烈的對比更能突出想要表達的主題。

       除了雙色搭配，還有多色純色搭配以及多色漸變色搭配。對于新手而言，剛開始設計畫面中色彩不宜過多，色彩越多，新手越難把控全局協調性。先從純色單色開始，再到純色多色組合，最后過度到漸變色組合搭配，逐漸練習，久而久之，收獲定是滿滿的。

       最后分享幾組好看實用的漸變色彩供大家參考，喜歡的可以收藏起來方便后期使用。

        這些好看的配色背后，有著共同的配色規律，掌握這些配色規律技巧才是我們真正的目的。今天分享的色彩小知識希望可以給大家在設計中帶來幫助，希望大家在不同的項目中靈活運用并最終形成自己的優秀配色習慣。