網(wǎng)頁(yè)設(shè)計(jì)之最簡(jiǎn)單實(shí)用的色彩搭配指南

創(chuàng)新互聯(lián)：今天的色彩搭配教程是針對(duì)零基礎(chǔ)的新手寫(xiě)的，分別是<基礎(chǔ)：色彩的組成>、<進(jìn)階：色彩的搭配>、<高階：調(diào)色三要素>3個(gè)部分，有圖有實(shí)例，文末推薦了一個(gè)網(wǎng)站一個(gè)視頻，都是幫你提高配色技巧的，然而這些都可以運(yùn)用到網(wǎng)站建設(shè)的網(wǎng)頁(yè)設(shè)計(jì)色彩搭配中，建議閱讀。

1. 基礎(chǔ)教程：色彩的組成

關(guān)鍵詞：原色 間色 復(fù)色 色環(huán)

所有的色彩都是源自”紅黃藍(lán)”三種原色。有人可能會(huì)潛意識(shí)地認(rèn)為三原色是”紅綠藍(lán)”，但其實(shí)不是。紅綠藍(lán)是顯示上的三原色，和美術(shù)上的三原色不一樣。

紅黃藍(lán)兩兩混合后得到三個(gè)二級(jí)色即“間色”綠橙紫。

原色與間色混合或間色與間色混合而形成越來(lái)越多的顏色，稱(chēng)之為“復(fù)色”。

最后由三種原色、三種間色和六種復(fù)色組成的系統(tǒng)就統(tǒng)稱(chēng)為十二色環(huán)(colorwheel)，也是學(xué)習(xí)色彩搭配的基礎(chǔ)。

2. 進(jìn)階教程：色彩的搭配

關(guān)鍵詞：?jiǎn)紊?近似色 補(bǔ)色

十二色環(huán)的存在并不只是一個(gè)擺設(shè)，它巧妙地建立了配色系統(tǒng)。常見(jiàn)的色彩搭配有：?jiǎn)紊钆?，近似色搭配，補(bǔ)色搭配，分散互補(bǔ)色搭配，三角對(duì)立的配色搭配……

單色搭配(monochromatic)

這個(gè)不用解釋?zhuān)褪侵挥靡环N顏色的搭配。

類(lèi)似色搭配(analogous colors)

色環(huán)上任意三個(gè)相鄰的顏色，被稱(chēng)為類(lèi)似色。通常認(rèn)為，它們放在一起會(huì)很和諧。類(lèi)似色是選擇相近顏色時(shí)十分不錯(cuò)的方法，可以在同一個(gè)色調(diào)中制造豐富的質(zhì)感和層次。理所當(dāng)然成為配色法則中最經(jīng)濟(jì)適用的一條。

一大片近似色將梵高叔叔的憂(yōu)郁高冷展現(xiàn)的淋漓盡致。

再放眼時(shí)尚圈，同類(lèi)色也是除了黑白灰以外最安全的穿搭法則哦!

但是在選擇的時(shí)候要注意比例上的調(diào)和，選一個(gè)為主要顏色。

補(bǔ)色搭配(complementary colors)

色環(huán)上相對(duì)的兩種顏色，被稱(chēng)為互補(bǔ)色。放在一起，會(huì)形成對(duì)比效果。比如藍(lán)色和橙色、紅色和綠色、黃色和紫色等?；パa(bǔ)色有非常強(qiáng)烈的對(duì)比度，在顏色飽和度很高的情況下，可以創(chuàng)建很多十分震撼的視覺(jué)效果。很多廣告和招貼為了吸引眼球經(jīng)常會(huì)使用，用作強(qiáng)調(diào)提示作用效果是極好的。

但是記得，在文本中使用互補(bǔ)色是很糟糕的。要用好互補(bǔ)色，最好的辦法就是：改變明度、降低純度，看起來(lái)會(huì)柔和許多。下面看幾個(gè)例子。

降低純度后的互補(bǔ)色相當(dāng)和諧。

《天使愛(ài)美麗》中的這個(gè)場(chǎng)景，是一個(gè)典型的紅綠互補(bǔ)色。

室內(nèi)裝修中互補(bǔ)色也很管用，清新又不失活潑。

分散互補(bǔ)色搭配(split-complementary colors)

尋找三種顏色，其中兩種互相類(lèi)似，另一種與它們形成對(duì)比，這就是分散互補(bǔ)色搭配。分散互補(bǔ)色搭配是初學(xué)者很好的選擇，怎么搭都很好看。

紅、深藍(lán)與淺藍(lán)搭配，好突出對(duì)比感，畫(huà)面又不失和諧。

三角對(duì)立配色(Triadic colors)

此外，如果要尋找三種互相平衡的顏色，可以選擇12色環(huán)上任意三個(gè)三角對(duì)立的顏色。

要成功地使用三色系產(chǎn)生和諧效果，需要謹(jǐn)慎地在色彩間取得平衡——只用一種主色，其他兩種顏色作烘托。

3. 高階教程：調(diào)色三要素

關(guān)鍵詞：色相 飽和度 明度

要精準(zhǔn)的調(diào)出每一種顏色，其實(shí)包括三個(gè)要素：色相、飽和度和明度。

色相(hue)：指飽和度和亮度都為100%的顏色。我們?nèi)庋鬯?jiàn)到于是能說(shuō)出來(lái)的顏色就叫色相，所有的色相都可以用色環(huán)來(lái)展示。

飽和度(saturation)即純度，指色彩的鮮艷程度——顏色中含有灰色的程度。飽和度越高，顏色越純，色彩越鮮明;飽和度越低，顏色中灰色成分越大，色彩越黯淡。

明度(value)，即色彩的亮度。反映的是色彩的深淺變化，如粉紅、大紅、深紅，都是紅，但一種比一種深。

明度的變化來(lái)自于顏色中白色的成分變化。一般情況下在顏色中加入白色，明度提高，加入黑色，明度降低。大值時(shí)，所有顏色都變成白色，最小值時(shí)，所有顏色都變成黑色。

下面來(lái)看一下明度(Value)的具體應(yīng)用。

TINT：HUE+WHITE

在色彩中加入白色。這種基調(diào)給人更加明亮、和平但缺少活力的感覺(jué)，更體現(xiàn)女性色彩，適用的行業(yè)有spa、美容等。

SHADE：HUE+BLACK

在色彩中加入黑色。神秘、黑暗、罪惡、危險(xiǎn)色調(diào)，更體現(xiàn)男性色彩。使用純色或更明亮的陰影色時(shí)，與漸變能很好搭配。

TONE：HUE+GREY

在色彩中加入灰色，調(diào)性不至于太黑暗但能突出冰冷的感覺(jué)。

最后給大家推薦一個(gè)視頻，一個(gè)網(wǎng)站和一本書(shū)。

一個(gè)視頻：，Vimeo上的視頻，上面文章里的一些色環(huán)截圖都是來(lái)自這個(gè)視頻。創(chuàng)新互聯(lián)，后面還會(huì)更新非常有想法的配色方案，缺乏靈感的時(shí)候不妨一看。并且還提供有建網(wǎng)站基礎(chǔ)知識(shí)。

本文名稱(chēng)：網(wǎng)頁(yè)設(shè)計(jì)之最簡(jiǎn)單實(shí)用的色彩搭配指南
當(dāng)前鏈接：http://www.muchs.cn/news24/167624.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站制作、服務(wù)器托管、定制開(kāi)發(fā)、手機(jī)網(wǎng)站建設(shè)、品牌網(wǎng)站建設(shè)、小程序開(kāi)發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)