本節書摘來自異步社群《網頁美工設計photoshop+flash+dreamweaver從入門到精通》一書中的第1章，第1.8節，作者： 安道通 更多章節内容可以通路雲栖社群“異步社群”公衆号檢視。
網頁配色很重要，網頁顔色搭配好壞直接會影響到通路者的情緒。好的色彩搭配會給通路者帶來很強的視覺沖擊力，不好的色彩搭配則會讓通路者浮躁不安。下面就來講述網頁色彩搭配的技巧。
1.8.1 背景與文字顔色搭配
文字内容和網頁的背景色對比要突出，比如，底色深，文字的顔色就要淺，以深色的背景襯托淺色的内容（文字或圖檔），反之，底色淡，文字的顔色就要深些，以淺色的背景襯托深色的内容（文字或圖檔）。如圖1-26所示背景與文字顔色搭配合理。
如圖1-27所示白色背景的網頁，黑色的文字效果就比較好，灰色的文字不是很好。
如圖1-28所示藍色背景的網頁，白色的文字效果就比較好，黑色或灰色的文字不是很好。
黑色背景
采用純白色的字效果最好。
采用橘黃色的字效果也好。
采用淺黃色的字效果也好。
采用藍顔色的字效果較差。
采用暗紅色的字效果較差。
采用紫色的字效果也較差。
如圖1-29所示黑色背景的網頁，文字采用淺黃色，效果比較好。
1.8.2 同種色彩搭配
同種色彩搭配是指首先標明一種色彩，然後調整透明度或飽和度，将色彩變淡或加深，産生新的色彩。這樣的頁面看起來色彩統一，有層次感。如圖1-30所示為同種色彩搭配。
1.8.3 兩色搭配
色彩搭配就是色彩之間的互相襯托和互相作用，而兩色搭配是用色的基礎。那麼怎樣選擇兩色搭配呢？
（1）選擇相鄰兩色搭配
相鄰色的配色技巧如下。
若一種顔色純度比較高，另一種顔色就需要選擇純度低或明度低的。當你調節了顔色互相作用的力量，色彩之間有主次關系搭配效果自然就和諧了。如圖1-31所示相鄰色搭配的網頁。
可以先標明一種色相，通過調整它的明度或純度值，得到另一色彩後，将兩者搭配。
（2）選擇對比色搭配
對比色搭配的網頁中，面積要有差別，可适當調整其中一種顔色的明度或飽和度，圖1-32所示為對比色搭配的網頁。