網頁設計配色系列之『紅色藍色』篇

2022-06-02 分類：網站建設

創新互聯最近整理了紅色、藍色的網頁設計配色。網頁設計配色系列之『紅色藍色』篇，增加了更多案例，而且案例的配色也越來越豐富，特別全面的系列教程，建議收藏。

網頁設計配色系列之『紅色』篇

色彩是光的魔術。而對于人類來說，其實光也是人腦的一個魔術。既然有魔術這樣的詞出現，我們就必須放棄對于色彩的固化的思考。比如，對于色彩的命名帶來的限制。

紅色是一種熱烈的色彩，它是所有色彩中最為奪人眼目的一種。紅色所擁有的熱情也是其他色彩所無法比擬的，當你想要表現出熱情活力的一面時，紅色當即是選。然而，就像我們之前談到的，既有熱情洋溢的正紅，也有輕柔粉嫩的嬰兒粉紅，這就是基于“紅”這個意向上的色調變化所拓寬的情感空間。因此，在選用“紅”作為主題色時，必須要認真的了解設計背后的傳達目的，根據目的最終來瞄準精確的紅色調。

網頁設計配色系列之『紅色』篇

深紅色往往象征著一種成熟的奢華，而用得不恰當也會顯露出某種邪惡，或讓人聯想到傷口血液這樣的意向。因此在網頁設計中并不多見。而高明度的紅則帶來某種熱情的同時又不至于暗沉，使用較多的也是這個區域的色彩。

紅色的鄰近色系是橙色和紫色，因此，紅色中也有橙紅和紫紅的參與，它們自然也夾雜了橙色和紫色的特點。

下面這個網頁中采用了紅色的明度漸變作為背景展示內容，紅色本身的感染力一覽無余。紅色作為背景是非常大膽的想法，因此運用漸變會讓背景不會搶奪走主角的風頭，這也是在運用背景紅色的一個解決方案。

將正紅作為背景是十分冒險的行為，如果你將這樣做，那么就要確保你的網站內容并不需要太多，也就是網站自身能發揮“奪眼球”的功能，而相對“實用”性將下降，毋庸置疑，一個全紅的網站看久了會讓人產生視疲勞。

而絕大多數情況下，紅色作為主色使用更為適宜，無論你采用什么顏色作為背景，將紅色用在主要的組件上，例如按鈕、導航等，都能從背景凸顯出來，而不同擔心主要元素用戶很難留意。

將縮略圖設計為紅色，在白色背景上方十分惹人注目，增加了點擊的欲望。

我們知道，紅色在色輪上屬于暖色系，暖色系的色彩都有一種往前擴大的感覺。有時候為了削減紅色的這種激進，可以選用偏紫的紅色。華美的紫紅色降低了飽和度以后，變為了淡淡的粉紅，讓人感受親切柔和，而作為背景色的存在則顯得非常舒適。

網頁設計這兩年開始越多使用淺粉色作為大面積使用，更多時候為了營造一種懷舊感，而同時又表達出時尚。粉色的背景往往可以使用高純度高明度的紅色作為主色。

相對而言，橙紅色則沒有紅色如此搶眼，而又沒有失掉紅色的活潑，更帶著橙色獨有的親和力。這樣的顏色在與飲食相關的設計中最為常見，可見它是一種開胃色。非餐飲類的網頁設計中用到了橙紅色，也能讓畫面變得更加親切活潑。

食品類的網頁設計中常見用到橙紅色，這種顏色能刺激人的食欲，讓食物看起來更好吃。

淺色粉作為背景，將橙紅色作為強調色，這一組搭配顯得時尚優雅又新鮮活潑。

后記

紅色作為強調色而存在，似乎顯得理所應當。顯然，我們對紅色的開發還不盡全然，有些時候我們避免使用這種過于醒目的顏色是為了讓使用變得更流暢，所以，降低紅色的飽和度使其不過與搶眼，提高紅色的明度讓頁面變得“清爽”都是在輕設計中極為重要的原則。如果真的需要用到厚重的深紅色，也要試著降低其使用的比例，使其發揮精準的聚焦作用。

網頁設計配色系列之『藍色』篇

藍色作為天空和海洋的顏色，我把它稱之為“宇宙色”，因此它自帶浩瀚和廣大是其他顏色所無法比擬的。然而又因為它是絕對的冷色調，因此在表達邏輯、理性、男性、專業、科技等主題上得以大量運用。藍色的色調也是相當豐富的，從深邃憂郁的深藍，到柔和清爽的粉藍……并不是每一種藍色都是冷感的，與它臨近的紫色和綠色都對藍色色調有一定范圍的影響。

網頁設計配色系列之『藍色』篇

藍色象征著科技，這一點已為大眾所接納，因此，各種以藍色作為背景的，對藍色的大面積運用，在這一主題下尤為常見。以高明度的高飽和度的藍色作為主色，拋棄了藍色的憂郁，非常富有活力。由于藍色容易聯系到水、天空、海洋等，因此它能大程度的發揮這類自然元素的視覺特性.

最易于和大面積的藍色搭配的還是黑白灰，這樣的搭配來得非常安全，但也會有點呆板，畫面略平淡。為了打破這種單一色彩的平淡，可將背景增加一些富有動態的紋理圖案，頓時讓畫面變得非常具有科技感。

當然，在大面積使用藍色的時候，當你想要突出某一焦點，最好的方式就是采用它的互補色，形成視覺的沖擊。如下頁面中，頁頭部分出現的橙色救生圈即是藍色的互補色，這一焦點讓人過目難忘。

藍色是冷色系，因此，為了讓畫面不至于太冷，增加暖色系是最好解決視覺平衡的做法。紅、橙、黃都是不錯的選擇。由于藍色一方面和這些暖色有強烈的對比，一方面又能使畫面回暖，因此在藍色為主色的頁面中增加暖色，可以說是常見的配色手法。

選用怎樣的暖色，其實完全取決于你所使用的藍色是怎樣的色調。并不一定是高明度高純度的藍色才是最優的選擇，盡管目前這一色彩受到科技界的高度青睞。如下這一網頁中選用了比較黯淡的藍色最為主色，明度相對較低，藍色有著淡淡的懷舊感，與此同時，橙紅色也作為強調色，讓畫面顯出活力。

藍色在自然界中四處可見，大海、天空……每張風景照多少都會包含著藍色這種色彩，因此在運用照片時，選用比較純粹的藍色系大海、山川或天空已經是一個不二之選。風景照片能表達的主題也非常廣泛：廣大、遼闊……這些都給足了設計師非常優質的素材，而將風景照作為大圖背景，也是近幾年流行的界面樣式。所不同的是，這些風景照片中的藍色色調的不同帶來不同的視覺感受，與此相匹配的色彩也有所不同。