對于任何網站而言，配色方案都是其中最關鍵的影響因素之一。你可以使用你所熟悉的配色方案，也可以跳出來選擇更加大膽、明快、更有性格的配色方案，它們或許更容易給人留下深刻的印象。

而今天我們要說的，是黃色。作為暖色調，黃色象征能量，帶來溫度，充滿生命力，它可以讓你的網站看起來更具有親和力，舒適而溫馨。毫無疑問，黃色色調的網站設計大多都非常的醒目，讓人難以忽視。

但是同時，它也是一個不容易掌控的顏色，一個不小心可能會毀掉網站的整個設計。所以，你需要清楚地了解黃色的運用手法——比如先看看那些設計優秀的網站是怎樣使用大面積黃色色調的。在黃色作為主色調/背景色的時候，文字內容如何展現，各種控件如何使用，這些都值得學習。

Lordz

明快的黃色和動感的舞蹈有著天然的契合度，這也是為什么瑞士城市舞蹈學院選擇使用黃色作為網站的主色調。為了確保網站內容的識別度，設計師采用的是黃黑搭配。

James Tupper

擁有韓國血統的攝影師JamesTupper 也在設計他的作品展示頁的時候選擇了黃色作為主色調。 在字體配色上，他同樣選取了黑色。

Collectif-yay

YAY 是一個平面設計類的合集網站，黃黑的配色使得文字內容無比的醒目。

Lavagraphics

黃色的色調和其他的色彩也可以很好的搭配，重要的是控制好對比度，這里的插畫的色調控制就非常合理，不會太深，但是和背景的黃色形成了很好的對比。

Adamhartwig

這是一位來自英國劍橋、獲得過不少獎項的設計師的個人作品網站。網站設計大氣，但是它最大的特色是交互，無論你是在桌面端、平板還是手機上訪問，交互的豐富度都非常的強。

Croscon

Croscon 是一個植根于設計和數字制造業的定制化軟件，網站的配色主色調黃色使用了黑色和白色來做搭配。

Vivedmv

Vivedmv 的網站所用的黃色飽和度相對較低，看起來也更加復古，搭配上復古的字體、圖形元素，整體的氛圍非常的一致。

Lunar gravity

這個網站在功能開發和內容策略上達到了一個不錯的平衡，在色調的搭配上也很好的體現出了設計、開發和內容三方面的功力。

idesign

依然是黃、黑、白的色彩搭配，經典的黃黑支撐起整個視覺，而白色在整個配色中顯得更加醒目，它承載了LOGO、副標題和關鍵性的按鈕。

Lambda – Responsive Moodle Theme

作為一個在線學習網站，Lambda 所用的主題基本上是經過深度定制的，深藍灰和白色占據了大量的面積，而黃色在整個網站中作為提亮色，很好的強調了關鍵性的內容與操作。

Fitness WordPress Theme eCommerce

Fitness 是一個為健身房和運動所定制的一個WP主題，極簡的風格、黃黑為主的色彩搭配讓這個主題在視覺上頗為突出。

Mobirise

Mobirise 是一個免費的BootStrap 模板，整體設計風格非常現代。和前面許多網站在配色上不同，它沒有使用黃黑來搭配，而是使用偏橙色的黃色和灰色搭配起來，文字內容則使用了白色。

ENERGY – Responsive WordPress Fitness Theme

ENERGY 是一個運動健身類的WP主題，黃色醒目的特色在這個主題中被體現的淋漓盡致。

ETHANOL PORTFOLIO

Ethanol Portfolio 是一個干凈簡約的免費Bootstrap 網站模板，這個簡約的模板是多功能的。黃色的文本標題在暗色調的背景上顯得無比清晰。

XPRESS

Xpress 用作作品展示或者時尚類的內容網站都是是相當不錯的選擇，黃色這一配色在網站中被很好的運用了起來。

Darklowpress

Darklowpress 是一個WP博客主題，大量的可定制的輪播圖能夠讓你更好的展示多媒體信息。

Pluton

Pluton 是一款現代多功能的HTML5著陸頁，基于BootStrap來開發的。整個網站使用了許多最新的HTML5、CSS3 和 jQuery 技術。

Agency

Agency 是一款有范兒的單頁式Bootstrap主題，對于商業機構和小公司而言，這個主題相當的不錯。這套主題的設計則是基于Golden PSD。

Taxi Park

這個網站是一個為出租車公司所設計的，黃色的色調和出租車的基礎色調保持了一致。

Hotel Deluxe?

Hotel Deluxe 同樣是一個響應式的網頁模板，其中黃色也是網站中最醒目的色彩而起到關鍵性的作用。

【技多不壓身的設計師才有高薪資！】

1. 平面設計：《超贊！設計師完全自學指南》
2. 交互設計：《交互設計師修煉指南！教你從零開始成為優秀交互設計師》
3. UI設計：《超實用新手指南！零基礎如何自學UI設計？》
4. 前端開發：《天貓高手來教你！零基礎如何系統地學習前端開發？》
5. 摳圖技巧：《從菜鳥到高手！PHOTOSHOP摳圖全方位攻略》
6. 配色方案：《色彩搭配速成！3個實用方法幫你全面搞定配色》
7. DPI指南：《基礎知識學起來！為設計師量身打造的DPI指南》
8. 交互設計自學路徑圖：《零基礎入門！給非科班生的自學路徑圖之交互設計篇》

原文地址：webdesigndev
優設譯文：@陳子木

本文由優設網原創翻譯，請尊重版權和譯者成果，轉摘請附上優設鏈接，違者必究。謝謝各位編輯同仁配合。

【優設網 原創文章 投稿郵箱：2650232288@qq.com】

================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺，專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量130萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com