首先要看你做的是什麼網頁，有沒有相關的品牌標識。

一般在開展設計之前，需要先進行VI或CI的設計，明確品牌視覺語言，這裡面要明確形（形狀）、色（顏色）、字（字型），構（構成），質（質地）。品牌特徵、產品調性都要依賴這些視覺維度來體現，所以先要想清楚這些問題，把設計的地基打好，然後再做上層設計。

具體到網頁，要看你做的是什麼客戶端的網頁，手機還是電腦？手機端就是H5，可視寬度比較小，電腦端則比較大。對於網頁的配色，應該根據前面提到的形色字構質，把網頁要用到的主色調、輔助色、對比色，警示色等常用顏色調配出來，這個調配的過程需要考慮使用的螢幕面積和頻率，讓他們搭配在一起的時候儘量和諧。這裡面有一些方法，比如從一張和諧的自然風光照片裡面取色，比如參考設計精美的網頁配色，也可以使用別人已經做好的配色方案，如https://www.uisdc.com/best-22-color-website如。確定好各個色調後，把他們置入PS或者Sketch的調色盤，設計頁面的時候直接吸取使用即可。

另外提示一下，網頁配色的顏色數量儘量要控制保守，不要融入太多的色調，這樣會讓頁面顯得很雜亂，現在的頁面設計都很簡潔，以突出內容，幫助使用者完成相應的任務為目的。所以事先設定好調色盤也可以幫助你避免使用過多的顏色，最後祝你達成自己想要的設計效果。

首先用PS等軟體取出圖片的顏色程式碼，一般格式為#******（*為16進位制數字1-f），然後在css檔案中將圖片區域的背景顏色設定為這個程式碼或相近的顏色就可以了。

我來說說說簡單，實用，粗暴的一個方式方法:

第一步，在背景圖層下方用矩形工具填滿整個畫布。第二，根據整個畫面的色調選取一個，比較中性的顏色，填入矩形填充色。第三部，最為重要的一步，把矩形上方的圖形，做一個去色的操作，改為柔光，之後鉗入矩形圖層，可根據不同的色調，改變矩形的顏色來調整整個畫面的平衡感，喜歡的請收藏，簡單，實用。