現(xiàn)實世界中，我們很難發(fā)現(xiàn)有一塊完全凝固不變的色彩，比如云彩雖說是白色，但總是又隱隱透出藍色、橙色等不同的漸變色，天空也并不盡然是全然相同的藍，而表現(xiàn)出了深淺不一的色調(diào)。我們在設(shè)計中運用到漸變色，也就是讓畫面還原更多的真實。

被北極光渲染的星空本身就帶著色彩的漸變流淌，照片本身的色彩漸變已表現(xiàn)出了動態(tài)的美輪美奐。

有時候背景運用漸變的同時，前景對象也運用漸變色，利用漸變色進行填充后，整個畫面充滿了未來感：

還可以將漸變色運用到元素上，這時漸變色就需要更加濃烈鮮明，從背景凸顯出來，形成視覺強調(diào)。

在需要被注意的大型文字中運用鮮艷度都非常高的大紅到紫色的漸變，背景采用接近無彩的暗調(diào)，讓文字更加璀璨奪目：

漸變不僅是色彩上的變化，還有更多是屬于時間的變化。開發(fā)網(wǎng)頁設(shè)計中漸變色的運用絕不僅僅止步于此。

運用漸變色增加色彩的豐富感，同時又讓畫面不至于凌亂。這在很多品牌站中所用較多。如果希望頁面顯得嚴肅，可以限制漸變所用的范圍?？傊?，漸變是一種"夢幻"的手段，而絕對非目的。

多色配色法：顏色的加減乘除

色彩不僅有色相，還包括飽和度、明度、色溫等特質(zhì)，與此同時，從心理層面上還會衍生出色彩的重量感、遠近距離等心理感受，兩種不同的色彩相互搭配，通過彼此的比例大小關(guān)系會衍生出更多復(fù)雜的影響。

雙色互補

將色環(huán)上處于180°相對而存在的色彩進行搭配，這兩種色彩在視覺上形成互補關(guān)系。我們知道色彩并不能簡單陳述為紅色、藍色，因此在相對的關(guān)系上也不能簡單就概括紅與藍是互補這樣籠統(tǒng)的結(jié)論，因為實際上紅色和藍色的色調(diào)都高低明暗種類繁多。而我們知道處于相對180°位置的一組色彩其本身相互補充又相互制衡的關(guān)系，在實際運用中會催生一種平衡的視覺滿足感。我們要做的依然是從情感上而非理性層面打開視覺的脈輪。

互補色處于色環(huán)上兩兩相對的位置，網(wǎng)頁設(shè)計中通常使用其中一個色彩作為主色或背景色，另一個作為強調(diào)色或襯托色而加以運用：

當背景色為藍色的同時，以橙色作為強調(diào)色，藍色和橙色為一組互補色：

雙色互補在運用面上并非對半平分，而是有選擇的采取一主一輔有機結(jié)合的方式，這樣有利于突出色彩的性格主題。

三色對比

處于色環(huán)上距離彼此120°位置的三種色彩，兩兩之間彼此為對比色，而這三種色彩的搭配也會形成非常和諧的組合。

此外，另有一類三色組合，是以其中兩種色彩彼此距離60°，第三種色位于它們相對180°位置上。利用前兩種色彩共同的力量而和另一個色彩形成相互制衡的關(guān)系，同樣能催生出另一種和諧。

三色對比有兩種情況，一種是在色環(huán)上選取彼此間隔120°的色彩，另一種是有某個色彩與其他兩個色彩保持180°相對的關(guān)系：

當然，在網(wǎng)頁設(shè)計中，挑選三種色彩運用到頁面中，要主要對配圖本身色彩加以控制，否則容易讓頁面顯得凌亂。尤其是輕質(zhì)風(fēng)格的設(shè)計中，色彩盡量予以控制在三種以內(nèi)，如果要選擇這類配色法，應(yīng)該盡量選擇明度較高、飽和度較低的色彩，沖淡色彩彼此的強烈沖擊。最好的辦法仍然是以某一個色彩作為主色，其他兩種色彩起強調(diào)、對比的作用。

網(wǎng)頁設(shè)計選用藍色、紫紅和粉紅的三色搭配，運用了三色對比，看上去色彩協(xié)調(diào)、活潑。網(wǎng)頁所采用的插畫配圖也遵循總的配色規(guī)律，保持了頁面配色風(fēng)格的統(tǒng)一性：

沒有運用配圖的時候，整個頁面回歸到極簡的狀態(tài)，這時運用純色對比，就是運用色彩本身的魅力來感染用戶。可以說，這樣的配色方式比較安全，讓審美變得更加純粹。

頁面被三種色彩均等分布，呈現(xiàn)出非常嚴格的平衡感：

就像我們曾經(jīng)說過，對單個頁面來說，網(wǎng)頁設(shè)計會有個全局的概念。有時候，網(wǎng)頁中一個頁面，或者一屏就可以被看作一件平面作品。所謂"三色"可以是從整個網(wǎng)頁出發(fā)，也可以是從一個屏幕上來看。即使我們發(fā)現(xiàn)有的網(wǎng)頁運用了不止三種顏色，但在一個屏幕中所出現(xiàn)色彩仍然控制在了三色對比的狀態(tài)。網(wǎng)頁的動態(tài)效果更是為配色的多變性增加了更多的靈動空間。

為了體現(xiàn)出嬰兒系列產(chǎn)品品牌的活潑童趣，運用多種色彩可以表現(xiàn)出五彩繽紛，而選用粉嫩的色調(diào)則強調(diào)了初生嬰兒的柔和感。頁面選用了藍色、紫色、綠色等色彩作三色調(diào)和，往下拖動時，粉紅色的出現(xiàn)讓頁面轉(zhuǎn)向了更加溫柔的氛圍，卻又與原有色彩無沖突：

一屏一色

我們從一個屏幕的視覺出發(fā)，而非從全局來看，一個屏幕運用一個單色進行搭配，是行之有效的極簡風(fēng)格配色法。它很好的解決了色彩單一的問題，與此同時，整個網(wǎng)頁依然保有豐富多彩的色彩印象。這類配色技巧在許多展示類的網(wǎng)頁中常見。

每一個頁面只運用一種主色，雖然整個頁面由多色組成，但色彩與色彩之間呈現(xiàn)出了豐富的動態(tài)的和諧關(guān)系：

每一屏運用不同的背景色，配圖以及網(wǎng)頁元素的色彩，比如橙色的按鈕和配圖與背景色相協(xié)調(diào)：

網(wǎng)頁中的頁面切換也非常靈活，可以通過鼠標滾動實現(xiàn)，還能通過切換按鈕切換主題畫面，也能達到一屏一色的目的。

EXTET.R的首頁設(shè)計非常巧妙地安排了一個類似時鐘一樣的圓形滾動播放主屏畫面，畫面采用不同的背景色和不同的展示主題。造型別致新穎：

大多時候，多色配色時所選用的配圖應(yīng)該盡量保持不驚擾原有配色的氛圍，或根據(jù)配圖來決定網(wǎng)頁的配色方案。

顏色與顏色搭配絕不是簡單相加，而是運用色彩的特性，作出更加豐富的加減乘除，其結(jié)果不是得到另一個單一的色彩感受，而是綜合其上的視覺效果和情感體驗。與其說色彩像幻術(shù)一樣無法抓取，不如說對于配色，忘掉條條框框的理性分析，或許能得到更多。

版權(quán)說明：本文節(jié)選自《輕設(shè)計——網(wǎng)頁設(shè)計中的輕奢主義與禪意思維》，購買地址：https://item.jd.com/12087863.html

最新評論