【示例】橙色系鄰近色網(wǎng)頁設(shè)計示例截圖如圖所示。
【分析】頁面第一眼看上去似乎色調(diào)上變化很多,但該網(wǎng)頁的色彩構(gòu)成主要是由黃色和橙色這兩種鄰近色構(gòu)成的,通過不同的明度和純度的變化而得到更為豐富的色階,它們是淺黃色、黃色、橙色、橙紅通過不同的形狀面積,位置變化而得。從HSB數(shù)值中的H可以看出屬于暖色范疇,3個色相的傾向不是很明顯,以至于色彩呈現(xiàn)較規(guī)律、緩和。
由于不同數(shù)值的明度表達(dá),純度也做出了不同的數(shù)值變化。淺色在這里主要起到調(diào)和主色調(diào)和點(diǎn)睛色的色彩過渡作用。點(diǎn)睛色在這里起到強(qiáng)調(diào)整個頁面的華麗感,增強(qiáng)整個頁面彩度的作用。
【點(diǎn)評】橙色與鄰近色黃、紅暖色調(diào)的搭配組合,是一種簡單又安全的方法,視覺韻律上處理得井然有序。整個頁面看起來艷澤華麗、新鮮充滿活力的感覺,符合Tide這一主題所要表達(dá)的目的。
橙色+藍(lán)色
【示例】橙色系對比色應(yīng)用網(wǎng)頁設(shè)計示例截圖如圖所示。
【分析】HSB數(shù)值中的H色相顯示主色調(diào)橙紅色為26,因為正紅色的H為0,正橙H為30,主色調(diào)橙紅色是往0偏移而得。正藍(lán)色是240,而該點(diǎn)睛色藍(lán)色為192,往綠度偏移,在RGB中的數(shù)值G160也能看出來,因此藍(lán)色的特性不是很強(qiáng)。
但由于橙紅色的明度和飽和度達(dá)到最高值,因此盡管藍(lán)色不是正藍(lán),但它的特性得到了很大程度的發(fā)揮。此種橙藍(lán)對比色中的藍(lán)色調(diào)配,比較少見,讓人很容易記住它。而橙紅色的飽和度明度都非常高,刺激度強(qiáng),屬于讓人不可久視的顏色。介于橙紅色和藍(lán)色之間,與藍(lán)色面積相當(dāng)?shù)陌咨鸬秸{(diào)和對比色橙紅與藍(lán)色之間關(guān)系的作用。
【點(diǎn)評】這組對比色通過使用的面積位置的不同來反映主次之間的關(guān)系。對比色能相互強(qiáng)烈地突出色彩特性。這組對比色屬于非常能突顯個性的顏色。
橙色+綠色
【示例】橙色系低對比度應(yīng)用網(wǎng)頁示例截圖如圖所示。
【分析】黃色是中間色,起到過渡對比色作用,在這組色里屬于調(diào)和色。藍(lán)色出現(xiàn)在產(chǎn)品圖案上,引導(dǎo)主次關(guān)系,增強(qiáng)視覺的注目點(diǎn)。與上組的橙色綠色相比,這組顏色強(qiáng)烈而刺激,色彩傾向無疑明確了很多。主色調(diào)橙紅色往紅色傾向,而紅色的對比色是綠色,因此整組顏色有強(qiáng)烈的對比效果。從HSB數(shù)值H上看,除了藍(lán)色外,其余幾種顏色純度都非常高,加上又是近于紅綠對比色。頁面的刺激強(qiáng)度是可想而知的強(qiáng)烈。
【點(diǎn)評】橙色是容易引起食欲的顏色,在這里得到了較充分的應(yīng)用。非色彩的白色和黑色在這里起到了非常重要的作用,拉大了色彩色階空間的距離。白色讓整個色調(diào)組合更加明快,而黑色增添色彩的厚重質(zhì)感—強(qiáng)烈中的強(qiáng)烈,增強(qiáng)對產(chǎn)品的視覺刺激。
小結(jié)
橙色在HSB數(shù)值的H中為30度,是正橙色。橙色是一個非常響亮注目的顏色。橙色的對比色是藍(lán)色,當(dāng)這兩種顏色彩度傾向越明確,對比強(qiáng)度就越大。但我們也看到,除了正宗的對比色橙藍(lán)色外,橙色和綠色隨著純度的升高,達(dá)到的對比效果也很強(qiáng)烈。在配色設(shè)計中可以多些不同明度、純度冷暖對比的嘗試,會有意想不到的收獲。白色是所有網(wǎng)頁設(shè)計中屬于較通用的顏色,它容易突出彩度的特性,明快于整個頁面,當(dāng)一個頁面設(shè)計沒有使用白色時,空間感覺減弱,容易造成彩度不夠明確、頁面有些沉悶等反應(yīng),相對來說增添頁面的厚重感覺,制造另外一種環(huán)境氣氛。
在網(wǎng)頁設(shè)計時黑色在色調(diào)組合的輔助角色里容易制造出厚重的色彩效果。色彩都是相對的,沒有絕對的配色組合,它們總是根據(jù)搭配不同的色彩組合或強(qiáng)或弱地表現(xiàn)出什么樣的特性。同類色、鄰近色的組合,是非常調(diào)和的色彩組合,即使減少了色相的數(shù)量,一樣也可以調(diào)配出很多不同的調(diào)和色彩。對于初學(xué)者來說,這是一個非常實用的配色方法。
當(dāng)前文章標(biāo)題:網(wǎng)頁設(shè)計中的黃色+橙色+橙紅色
當(dāng)前URL:http://51zuanshi.com.cn/news/wzzz/3183.html