漸變色不但是網頁設計中一個新的流行趨勢，它還能更好地引導視覺焦點、渲染網站氛圍、傳遞網站情緒等。如何利用漸變色提升網站設計的美學水準呢?想要運用好漸變色，最重要是在色彩搭配和透明度上下功夫，讓網站的氣氛煥然一新，變得光彩奪目。

漸變色為何成為網頁設計的新趨勢?

信息大爆炸時代，用戶在使用產品的時候，面對這越來越多的信息，往往很容易會錯過重要的信息。為了突出內容，減少過度美觀修飾對信息的干擾，扁平化風格也隨之而流行。

雖然扁平化風格無論是對於pc端還是移動端都有不少的優點，但是仍會存在着不足，例如：簡潔有餘，張力不足等。有時候，扁平化設計過於太「平」(過於簡潔)，會直接影響網站的可用性，把可操作性的元素都會被淹沒。

因此設計師為了彌補扁平化的缺陷，重新在色彩上尋求突破口，使用漸變色就是其中最有利的武器。

漸變色如何彌補扁平設計造成的問題?

① 單色相漸變

從2017年開始，APP的UI界面上色彩運用越來越大膽。例如：最近比較熱門的APP遊戲——紀念碑谷2的背景採用了單色相的漸變，使整個畫面變得豐富且清新。

② 多色相漸變

使用色系相近的不同顏色，會帶來強烈的視覺衝擊效果，讓用戶產生一種夢幻的感覺。而最早嘗試多色相漸變風格的是ins。Ins擬物風時期的logo一直廣受好評，在進入扁平風時代後，ins沒有簡單的將logo拍平，而是採用強烈的多色漸變。它極簡風格的UI界面，對用戶十分友好，用戶只需要欣賞魅力的照片，然後「點贊」就行了。

③ 不同明度的漸變色組合

然而，新潮的設計師們有怎麼會滿足於此呢?不少設計都把漸變色玩出更多新花樣，例如大陸知名視頻APP——優酷便是玩的最出色之一。

不過這種風格相對比較複雜，不適合尺寸較小的icon，所以優酷的icon選擇使用單色相漸變。

④ 高飽和度高亮度使用

此類色彩大多運用於電商的H5活動頁面中，能夠極大地調動活動所要營造的氛圍，給用戶最強的視覺衝擊力，從而達成消費的目的。

在扁平設計中，如何玩轉漸變色?

一、直線型漸變

首先，我們將漸變色的部分分為A、B、C三個部分進行取色分析。其次，要讓自己的漸變色配色看上去不要太髒，取色的亮度(B)就要很高，數值均在90以上。

二、垂直型漸變+球形漸變

由於web界面面積比較大，所以只使用垂直型線性漸變會令畫面略顯單調，如果這個時候我們加入一個球形漸變，就能增加畫面的豐富性。

色彩的運用是需要多看多臨摹才能把握精粹，如果你都想玩轉漸變色，還等什麼，快打開繪圖軟件嘗試一下吧!