網頁頁面中總是由具有某種內在聯系的各種色彩，組成一個完整統一的整體，形成畫面色彩總的趨向，稱為色調。也可以理解為色彩狀態。色彩給人的感覺與氛圍，是影響配色視覺效果的決定因素。 
　　為了使網頁的整體畫面呈現穩定協調的感覺，以便充分的掌握其規律來更好的分析學習，上次我們介紹了視覺角色主次位置的幾個概念，本節我們介紹色彩的對比。
　　
　　對比與調和就是形式美的變化與統一規律

　　在一定條件下，不同色彩之間的對比會有不同的效果。在不同的環境下，多色彩給人一種印象，色彩單一給人另一種印象。
　　各種純色的對比會產生鮮明的色彩效果，很容易給人帶來視覺與心理的滿足。紅、黃、藍三種顏色是最極端的色彩，它們之間對比,哪一種顏色也無法影響對方。
　　很多朋友都以為色彩對比主要是紅綠、橙藍、黃紫色的對比，實際色彩對比范疇不局限于這些。是指各種色彩的界面構成中的面積、形狀、位置以及色相、明度、純度之間的差別，使網頁色彩配合增添了許多變化、頁面更加豐富多彩。
　　
　　色彩的對比規律大致有以下幾點：
　　
　　■ 色相對比
　　是指因色相之間的差別形成的對比。當主色相確定后，必須考慮其他色彩與主色相是什么關系，要表現什么內容及效果等，這樣才能增強其表現力。不同色相對比取得的效果有所不同，兩色越接近，對比效果越柔和。越接近補色，對比效果越強烈。
　　
　　
　　→ 色相對比網頁例圖：http://www.portfolios.com


　　
　　
　　
　　色相對比分析：
　　主要是以綠色與藍色之間的色相對比。從HSB數值上可看出嫩綠色的S純度高B亮度也很高，因此艷麗的顏色作為背景與前景純度稍低的墨綠和轱藍色形成色相之間的對比。前景的墨綠雖然純度達到最高值100％，比主色調高不少，但是因為亮度低，因此色彩顯示沒有主色調明艷。
　　結論：
　　該頁面色相的對比，主要作用于前景與背景的對比、局部與整體的對比。
　　
　　
　　
　　■ 明度對比
　　
　　明度對比可分為:彩色差的明度對比及非彩色差的明度對比
　　
　　是指色彩之間明暗程度的差別而形成的對比。是頁面形成恰當的黑、白、灰效果的主要手段。明度對比在視覺上對色彩層次和空間關系影響較大。例如檸檬黃明度高，藍紫色的明度低，橙色和綠色屬中明度，紅色與藍色屬中低明度。

→ 明度對比網頁例圖：http://www.dior.com



　　明度對比分析：（非彩色差）
　　嚴格來說，該頁面應該是黑白灰色非色彩構成，攝影圖片中的人物衣服為灰色，相對單純的黑白對比柔和舒適于視覺。能使頁面顯得更單純、統一，形成另一道獨特的風景。