【文章內容簡介】 主色調顏色和明度較暗的深紅色結合，使得明度稍暗?！? 主色調背景色飽和度較高，由于降低明度，顏色變得較沉穩(wěn)。輔助色RGB添加其他顏色，G和B區(qū)別不大，因此飽和度降低，顏色趨于柔和穩(wěn)定。點睛色的加入提亮，頁面視覺效果強化。結論：　　前景色通常要較明顯的區(qū)別于背景色，達到臺前的宣傳目的。當飽和度較低的前景色與背景色變化不明顯時形成的是另外一種柔和統(tǒng)一的效果。玫瑰紅色　　　　玫瑰紅色色環(huán)上已經接近冷色，是紅色系里的冷色系。HSB中H 0為紅色的最高值，越接近0度數(shù)值紅色特性越明顯，否則逐漸冷色傾斜，而該數(shù)值偏離0度稍遠?！　№撁嬷饕蓛煞N不同明度、純度的玫瑰色調組成。兩色RGB中R最高，紅色特性較明顯。輔助色玫瑰色，加入G，色調向冷色稍微偏移，由于加入G，HSB飽和度輕微減弱，但隨著明度增加，色彩趨于艷麗，符合突出前景的目的。主色調純度達到最高飽和，由于明度降低，相對于輔色調較沉穩(wěn)，適合做背景色?！　”尘吧颓熬吧鞫容^為接近，加入白色邊框，強烈了前景色于背景色的區(qū)分，加強視覺強化效果。結論：　　背景色和前景色明度較接近，顏色給人的視覺較悶，加入少量白色劃分使得色彩引導的主次塊面更分明，頁面明快許多?！　∵@類顏色的組合多用于女性主題，例如：化妝品、服裝等，容易營造出嬌媚、誘惑、艷麗等氣氛。　明度粉紅色 　　粉紅色主要是紅色系中明度的高亮度的變化。是紅色系里的冷色系。RGB顯示明度較高，因此HSB中S純度下降，幾乎呈最低值。 　　主色調和輔助色對比可知：主色調混合的G較多且明度較高，因此純度較低色調柔和，在框架區(qū)域內較適合做類似背景色的輔助性崗位。輔助色R比主色調R稍高，紅色性稍明顯，加入G相對少，B明度稍低，因此相對純度要高，輔助色在框架區(qū)域的導航位置突出導航。點睛色突出標志及購物主體的作用。　　背景白色除突出前面粉紅色主體，在前景也有出現(xiàn)，背景色與前景色相互牽制，減少空間距離。結論：　　RGB數(shù)值呈現(xiàn)相近的高數(shù)值時，色彩越柔和協(xié)調，純度相對降低，頁面呈高明度灰色段，視覺刺激緩慢。以粉紅色為主色調的頁面，女性主題內容特征傾向明顯。粉紅色頁面里純度都較低，任何一個純度高小面積使用的顏色都能起到點睛的效果?！　∵@類顏色的組合多用于女性主題，例如：化妝品、服裝等，鮮嫩而充滿誘惑，傳達著柔情、嬌媚、溫柔、甜蜜、純真、誘惑的心理感受。對比色：橙紅色+藍色 　 橙色是藍色的對比色，這組對比色中的橙紅色傾向于紅色。　 頁面的背景色使用紋理圖形由深至淺的制造空間范圍，模擬真實環(huán)境。數(shù)值取其中間色值來分析，背景藍色明度較低，由于冷色比暖色視覺傳遞速度慢，適合作為輔助角色突出前景的應用。主色調橙紅色R255，SB都100%，視覺刺激非常強烈，運用大面積高純度來突出藍色產品主體，形成視覺對比背景藍色與前景橙紅色，前景橙紅色與產品主體藍色的二次對比?！　↑c睛色白色，使這組對比色在頁面中表現(xiàn)得更協(xié)調，調和的作用。結論：　　顏色的深淺能營造空間感的效果，也能輔助性的制造主次效果。顏色除性能對比，面積對比、位置安排也是制造主次效果的關鍵。　　橙色藍色對比色在網頁上比其他兩組對比色紅色綠色，黃色紫色應用得多，能迅速的傳達網站主題內容、網頁主體，容易增添強烈的興奮感，多用于食品、休閑娛樂、產品等。配色：紅色+黑色　　紅色與黑色搭配被譽為商業(yè)成功色，鮮亮的紅色多用于小面積的點綴色?！　〖t色添加G和B飽和度稍降低，因此紅色大面積使用不會覺得刺激或不舒服，背景藍色加入適量漸變，使頁面的節(jié)奏呈現(xiàn)緩和。輔助色黑色的加入，與深紅色在明度拉大，頁面色彩元素相對活躍不少。　　點睛色白色，所放的位置和面積，起到平衡黑色位置面積的作用，也達到醒目的效果。結論：　　顏色位置的擺放，起到平衡頁面視覺，突出主題效果。背景色漸變效果、整體與前景人物黑色對比呈淺色，前景人物黑色與背景深紅色、背景深紅與前景白色文字相互之間的關系，構成空間環(huán)境的視覺效果?！　〖t色是降低明度的深紅色，為主色調和背景色大面積使用。紅黑搭配，常用于較前衛(wèi)時尚、娛樂休閑、電子商務等等要求個性的網頁設計配色里，也又有用于部分政治、新聞的頁面。配色：紅色+黑色+灰色 　　選紅色為輔助色，從頁面功能和表達主題看，紅色作為頁面的點睛色，強烈突出主題?！　〖t色HBS的H0，紅色特性的最高值，S最高飽和度，在明度最低黑色背景襯托下，特性發(fā)揮到極致，頁面醒目而響亮。紅色與黑色本是對比強烈的配色，由于背景灰色，緩和頁面的視覺刺激度。背景灰色RGB變化不大，因此顏色純度較低、趨于平穩(wěn)柔和，輔助前景內容的呈現(xiàn)?！　“咨屒熬昂捅尘暗膭澐指黠@，活躍頁面中的色彩元素。結論： 　　使用面積小的純度高的顏色在非色彩的黑色和灰色上，是產生變化頁面的顏色，達到突出主題的目的。本部分小節(jié)：　　 ● 紅色RGB中R255，HSB中H0，達到紅色最高值。隨著純度的提高、亮度的適度增加，易迅速傳達、醒目性特征發(fā)揮得越明顯。和其他顏色一樣，顏色相互混合的越多，明度越低，飽和度越低，視覺沖擊力越弱?！　?● 顏色的對比：對比色紅色綠色的搭配，紅色的特性發(fā)揮得越明顯。另外紅與黑的搭配，也較能展現(xiàn)紅色的魅力。　　 ● 根據(jù)主題的需要，除對比色的應用，還有面積、位置上對比應用，也能很好達到突出主題產品主體的目的。網頁設計配色應用實例剖析——橙色系橙色具有輕快、歡欣、收獲、溫馨、時尚的效果，是快樂、喜悅、能量的色彩。在整個色譜里，橙色具有興奮感，是最耀眼的色彩。給人以華貴而溫暖，興奮而熱烈的感覺，是令人振奮的顏色。具有健康、富有活力、勇敢自由等象征意義，能給人莊嚴、尊貴、神秘等感覺。橙色在空氣中的穿透力僅次于紅色，也是容易造成視覺疲勞的顏色。在網頁顏色里，橙色適用于視覺要求較高的時尚網站，屬于注目、芳香的顏色，也常被用于味覺較高的食品網站，是容易引起食欲的顏色?！　∠旅娓鶕?jù)橙色系不同屬性鄰近色、同類色、對比色的搭配做不同的舉例分析。橙色 　　 橙色系分析：　　主色調橙色HSB的H 30正橙色。飽和度和亮度到最高值，頁面的視覺刺激是極其耀眼強烈的。　　選取三種面積相當是整個頁面使用得最少的顏色為點睛色，頁面生動，運用于導航位置，從而達到突出主題的效果。HSB明度純度相對較低，與明度純度較高的背景正橙色形成鮮明的對比?！　》秶^大的背景白色、前景圖片灰白色和小細節(jié)前景白色文字制造出明快氣氛，呼應統(tǒng)一頁面?！　≥o助色在這里是橙色與白色的過渡色。結論：　　飽和度與純度很高特性明顯的顏色，在達到視覺沖擊力的同時，可適當采用少許對比色調和緩和視覺，從而削弱視覺的疲勞度。深橙紅色系 　　 　　 深橙紅色系分析：　　色相度中0為正紅色，30為正橙色，主色調HSB的H22，深橙紅色是橙色基礎上加入鄰近色紅色，整體上降低明度而得，紅色本身較橙色明度低，橙紅色的明度呈現(xiàn)出較低狀態(tài)?！? 輔助色選明度相對于主色調更低的三種顏色，前面兩種飽和度都較高，最后一種灰藍色由于明度較高因此飽和度降低，是主色調與前面兩種輔助色的協(xié)調色?！　№撁姹尘吧\用紋樣，是主色調和明度較暗的深紅色結合而得，使得明度稍暗?！? 主色調背景色飽和度較高，但是降低了明度，顏色變得較沉穩(wěn)。輔助色添加其他顏色，G和B區(qū)別不大，因此飽和度降低，顏色趨于柔和穩(wěn)定。點睛色的加入和提亮，使頁面視覺效果得到強化?！?結論：　前景色通常要較明顯的區(qū)別背景色，達到臺前的宣傳目的。當飽和度較低的前景色與背景色變化不明顯時，形成的是另外一種柔和統(tǒng)一的效果。淺橙色同類色　　 　　 淺橙色同類色分析：　　主色調輔色調在HSB的H36，頁面色調是在同一種橙色的基礎上明度發(fā)生變化。主色調是淺橙色，明度越高飽和度越低，頁面上減弱了飽和度較高的橙色特性，網頁呈現(xiàn)出柔和自然稍有些發(fā)灰的調子。　網頁是在橙色這個顏色上做不同明度黑白灰色階的柔和變化，屬于單色調配色非常的單純。色階平穩(wěn)，同時存在著不夠醒目的狀態(tài)。白色起到拉開主色調和輔色調空間距離，增強輔色調橙色的特性，使整個稍許有些發(fā)灰的頁面明快不少。也由于白色屬于非色彩，只在明度上呈最高數(shù)值而無彩度，不能給頁面帶來彩度所具有的鮮活靚麗的感覺，另一方面卻也呈現(xiàn)出質樸的感受。 結論：　　前面提到同類色是在同一色相中不同的明度顏色變化。因此這類顏色相對其他類別顏色來說明凈而單純，配色上較容易達到協(xié)調統(tǒng)一，但也容易顯得單調?！　№撁媾渖珔f(xié)調舒服，但看多的確有些單調乏味的感覺，這也是同類色搭配的特性。由于運用漸變調和方法，該頁面占有前面提到的4種色彩中的調和方法的2種，整個頁面呈現(xiàn)出調和中的調和是勿庸置疑的，但也同時顯得有些單調，沒有色彩亮點。橙色系鄰近色（黃色+橙色＋橙紅色）　　 　　 橙色系鄰近色（黃色+橙色＋橙紅色）分析：　　看上去似乎色調上變化很多，但網頁的色彩構成主要是由黃色和橙色這兩種鄰近色構成的，通過不同的明度和純度的變化而得到更為豐富的色階，它們是淺黃色、黃色、橙色、橙紅通過不同的形狀面積，位置變化而得。HSB中的H可以看出屬于暖色范疇，三個色相的傾向不是很明顯，以至于色彩呈現(xiàn)較規(guī)律、緩和。由于不同明度表達，純度也做出不同變化。　　淺色主要起到調和主色調和點睛色的色彩過渡作用。點睛色強調整個頁面的華麗感，增強頁面彩度。結論：　　橙色與鄰近色黃、紅暖色調的搭配組合，是一種簡單又安全的方法，視覺韻律上處理得井然有序。整個頁面看起來艷澤華麗、新鮮充滿活力的感覺，符合Tide這一主題所要表達的目的。橙色系對比色（橙色＋藍色）　　 橙色系對比色（橙色＋藍色）分析　　HSB中的H 26，正紅色H為0，正橙H為30，主色調橙紅色是往0偏移而得。正藍色是240，點睛色藍色為192，往綠偏移，在RGB中G160，因此藍色的特性不是很強。但橙紅色的明度飽和度達到最高值，因此盡管藍色不是正藍，但它的特性得到了很大程度的發(fā)揮?！　〈朔N橙藍對比色中的藍色調配，比較少見，讓人很容易記住它。而橙紅色的飽和度明度都非常高，刺激度強，屬于讓人不可久視的顏色?！　〗橛诔燃t色和藍色之間，與藍色面積相當?shù)陌咨?，起到調和對比色橙紅與藍色之間關系的作用。 結論：　　這組對比色通過使用的面積位置的不同來反映主次之間的關系。對比色能相互強烈的突出色彩特性。這組對比色屬于是非常能突顯個性的顏色。橙色系低對比度（橙色+綠色）　　 橙色系低對比度（橙色+綠色）分析：不看數(shù)值會以為這是一組純度較低的顏色。主色調HSB的H30正橙色，黃綠色的明度較低且色相傾向不夠明確，背景有少許的暗橙色紋樣，頁面沒有高亮度白色點綴襯托，使得純度的彩度不夠確切，很容易造成頁面純度較低的錯覺。　　頁面最亮的顏色除“書本”最亮色淺黃色外，就是點睛色黃色。黃色是所有彩度色中明度最高的顏色，不同明度純度的黃色系讓整個頁面明亮了不少，它是整個頁面明度色階的最高調。黃綠色的出現(xiàn)，讓本只有鄰近色的橙色系多些內容，頁面配色豐富不少、視覺節(jié)奏多些變化。 結論：　這類顏色的組合隨著不同色階明度的變暗，頁面沒有白色襯托，制造出另外一種古典的環(huán)境氛圍，有如娓娓道來的故事場景，也是一種不錯的主題配色方法?！? 本頁面的配色設計亮點是——無白色設計。橙色系高純度高對比度（橙紅色+綠色）　　 橙色系高純度高對比度（橙紅色+綠色）分析：與上組的橙色綠色相比，這組顏色強烈而刺激，色彩傾向無疑明確很多。主色調橙紅色往紅色傾向，而紅色的對比色是綠色，因此整組顏色有強烈的對比效果。HSB數(shù)值H上看，除藍色外，其余幾種顏色純度都非常高，加上又是近于紅綠對比色。頁面的刺激強度是可想而知的強烈?！　↑S色是中間色，起到過渡對比色作用，在這組色里屬于調和色。藍色出現(xiàn)在產品圖案上，引導主次關系，增強視覺的注目點。結論：　　橙色是注目容易引起食欲的顏色，在這里得到較充分的應用?！　》巧实陌咨秃谏谶@里起到非常重要的作用，拉大色彩色階空間的距離。白色讓整個色調組合更加明快，而黑色增添色彩的厚重質感——強烈中的強烈，增強對產品的視覺刺激?！　　?本部分小節(jié)：● 橙色HSB的H30，正橙色。橙色是非常響亮注目的顏色。橙色的對比色是藍色，當這兩種顏色彩度傾向越明確，對比強度就越大。但我們也看到，除正宗的對比色橙藍色外，橙色和綠色隨著純度的升高，達到的對比效果也很強烈。 　 在今后的配色設計中可以多些不同明度純度冷暖對比的嘗試，會有意想不到的收獲。 ● 白色是所有網頁設計中較通用的顏色，它容易突出彩度的特性，明快整個頁面，當頁面設計沒有使用白色時，空間感覺減弱，容易造成彩度不夠明確、頁面有些沉悶等反應，然而又相對來說增添頁面的厚重感覺，制造另外一種環(huán)境氣氛。黑色在色調組合的輔助角色里容易制造出厚重的色彩效果?！　∮忠淮胃惺艿缴实南鄬π?，沒有絕對的配色組合，根據(jù)搭配不同的色彩組合或強或弱的表現(xiàn)出什么樣的特性?！?同類色、鄰近色的組合，是非常調和的色彩組合，即使減少色相的數(shù)量，一樣也可以調配出很多不同的調和色彩。對于初學者來說，這是一個非常實用的配色方法。網頁設計配色應用實例剖析——黃色系黃色是陽光的色彩，具有活潑與輕快的特點，給人十分年輕的感覺。象征光明、希望、高貴、愉快。淺黃色表示柔弱，灰黃色表示病態(tài)。它的亮度最高，和其他顏色配合很活潑，有溫曖感，具有快樂、希望、智慧和輕快的個性。黃色也代表著土地、象征著權力，并且還具有神秘的宗教色彩?！　↑S色的性格冷漠、高傲、敏感、具有擴張和不安寧的視覺印象?！　\黃色系明朗、愉快、希望、發(fā)展，它的雅致，清爽屬性，較適合用于女性及化妝品類網站?！　≈悬S色有崇高，尊貴，輝煌、注意、擴張的心理感受?！　∩铧S色給人高貴、溫和、內斂、穩(wěn)重的心理感受。 下面根據(jù)黃色系不同屬性鄰近色、同類色的高純度低純度色彩搭配做不同的舉例分析。黃色系網頁例圖 　　　 　　黃色系分析：　　黃色是所有彩色中明度最高的顏色。上圖HSB的H是60，是正黃色，RGB中B51，降低了HSB的飽和度S80％，但是大面積的黃色仍使得該頁面色彩明亮顯眼。