【示例】橙色系鄰近色網頁設計示例截圖如圖所示。

【分析】頁面第一眼看上去似乎色調上變化很多，但該網頁的色彩構成主要是由黃色和橙色這兩種鄰近色構成的，通過不同的明度和純度的變化而得到更為豐富的色階，它們是淺黃色、黃色、橙色、橙紅通過不同的形狀面積，位置變化而得。從HSB數值中的H可以看出屬于暖色范疇，3個色相的傾向不是很明顯，以至于色彩呈現較規律、緩和。

由于不同數值的明度表達，純度也做出了不同的數值變化。淺色在這里主要起到調和主色調和點睛色的色彩過渡作用。點睛色在這里起到強調整個頁面的華麗感，增強整個頁面彩度的作用。

【點評】橙色與鄰近色黃、紅暖色調的搭配組合，是一種簡單又安全的方法，視覺韻律上處理得井然有序。整個頁面看起來艷澤華麗、新鮮充滿活力的感覺，符合Tide這一主題所要表達的目的。

橙色+藍色

【示例】橙色系對比色應用網頁設計示例截圖如圖所示。

【分析】HSB數值中的H色相顯示主色調橙紅色為26，因為正紅色的H為0，正橙H為30，主色調橙紅色是往0偏移而得。正藍色是240，而該點睛色藍色為192，往綠度偏移，在RGB中的數值G160也能看出來，因此藍色的特性不是很強。

但由于橙紅色的明度和飽和度達到最高值，因此盡管藍色不是正藍，但它的特性得到了很大程度的發揮。此種橙藍對比色中的藍色調配，比較少見，讓人很容易記住它。而橙紅色的飽和度明度都非常高，刺激度強，屬于讓人不可久視的顏色。介于橙紅色和藍色之間，與藍色面積相當的白色，起到調和對比色橙紅與藍色之間關系的作用。

【點評】這組對比色通過使用的面積位置的不同來反映主次之間的關系。對比色能相互強烈地突出色彩特性。這組對比色屬于非常能突顯個性的顏色。

橙色+綠色

【示例】橙色系低對比度應用網頁示例截圖如圖所示。

【分析】黃色是中間色，起到過渡對比色作用，在這組色里屬于調和色。藍色出現在產品圖案上，引導主次關系，增強視覺的注目點。與上組的橙色綠色相比，這組顏色強烈而刺激，色彩傾向無疑明確了很多。主色調橙紅色往紅色傾向，而紅色的對比色是綠色，因此整組顏色有強烈的對比效果。從HSB數值H上看，除了藍色外，其余幾種顏色純度都非常高，加上又是近于紅綠對比色。頁面的刺激強度是可想而知的強烈。

【點評】橙色是容易引起食欲的顏色，在這里得到了較充分的應用。非色彩的白色和黑色在這里起到了非常重要的作用，拉大了色彩色階空間的距離。白色讓整個色調組合更加明快，而黑色增添色彩的厚重質感—強烈中的強烈，增強對產品的視覺刺激。

小結

橙色在HSB數值的H中為30度，是正橙色。橙色是一個非常響亮注目的顏色。橙色的對比色是藍色，當這兩種顏色彩度傾向越明確，對比強度就越大。但我們也看到，除了正宗的對比色橙藍色外，橙色和綠色隨著純度的升高，達到的對比效果也很強烈。在配色設計中可以多些不同明度、純度冷暖對比的嘗試，會有意想不到的收獲。白色是所有網頁設計中屬于較通用的顏色，它容易突出彩度的特性，明快于整個頁面，當一個頁面設計沒有使用白色時，空間感覺減弱，容易造成彩度不夠明確、頁面有些沉悶等反應，相對來說增添頁面的厚重感覺，制造另外一種環境氣氛。

在網頁設計時黑色在色調組合的輔助角色里容易制造出厚重的色彩效果。色彩都是相對的，沒有絕對的配色組合，它們總是根據搭配不同的色彩組合或強或弱地表現出什么樣的特性。同類色、鄰近色的組合，是非常調和的色彩組合，即使減少了色相的數量，一樣也可以調配出很多不同的調和色彩。對于初學者來說，這是一個非常實用的配色方法。