網(wǎng)頁設(shè)計之色彩理論

涉及到顏色時，您可以使用幾乎無限的調(diào)色板。 了解如何正確地做到這一點。

在設(shè)計網(wǎng)站時，您可以選擇高達1680萬種顏色。 當你開始將它們組合成一個調(diào)色板時？ 您的一系列選擇立即變得無限。

為了讓您入門，我將深入探討以下主題：

詞匯 - 從色調(diào)到飽和到溫暖等等，我們將涵蓋語言設(shè)計師在說話時使用的顏色

色輪 - 用于可視化顏色之間關(guān)系的強大工具

配色方案 - 如何使用色輪選擇您的配色方案

色彩心理學 - 人們通常與特定顏色相關(guān)的感受和意義

工具和資源 - 應用程序和指南幫助您掌握顏色設(shè)計

為什么你應該關(guān)心顏色

如果有人把你的鑰匙交給你的夢想車，免費的話，你的頭會興奮地爆炸，對吧？ 當然！

但如果這輛車被漆成你最討厭的色調(diào)呢？ 或者每個面板完全是不同的顏色？ 或者如果室內(nèi)混合石灰綠和建筑黃色？

你可能不太興奮，對吧？

顏色有意義。 它們就像字體一樣傳遞語氣和情感沖擊，這使得它成為一個強大的設(shè)計工具。

顏色的詞匯
在我們深入理論之前，您需要了解以下術(shù)語：

原色是所有其他色調(diào)的基礎(chǔ)。 人類感知三種基本顏色：品紅色，青色和黃色。 我們所看到的每一種顏色都包含這三種顏色的組合，其數(shù)量，亮度，色彩和陰影（見下文）不盡相同。

傳統(tǒng)上，我們認為紅色，藍色和黃色是主要顏色，但研究表明洋紅色，青色和黃色更能描述我們的顏色體驗。

在網(wǎng)絡(luò)上，我們使用RGB（紅綠藍）和十六進制值來表示顏色。

RGB顏色系統(tǒng)將所有顏色定義為三個不同值的組合：一個特定的紅色，另一個綠色，另一個藍色。 所以：

- rgb（59,89,145）等于Facebook藍色

- rgb（0，0，0）等于黑色

- rgb（255,255,255）等于白色

十六進制顏色系統(tǒng)將每個值轉(zhuǎn)換為十六進制（基數(shù)為16）的表示形式，如下所示：

- ＃3b599b等于Facebook藍色

- ＃000000等于黑色

- #ffffff等于白色

每兩個字符代表一個顏色值，因此對于Facebook藍色，紅色為3b，綠色為59，而9b為藍色。

熱和冷

顏色也有"溫暖"，每種顏色都可以分為溫暖或涼爽的顏色。

溫暖的顏色含有更多的紅色和黃色。 他們可以在設(shè)計中喚起一種溫暖和激情。 他們也可以感覺到非常具有侵略性和大膽，提醒我們國際停車標志。 這就是為什么紅色經(jīng)常用于錯誤消息。

涼爽的顏色包含更多的藍色，引起寒冷的氣候，冰，冬天，水，夜間，死亡和悲傷。 它們可以帶有孤獨，冷漠和恐懼的內(nèi)涵。 涼爽的顏色也不那么積極和舒緩。 想想藍天，或者海灘上清澈湛藍的海水。 放松了嗎？

溫度

增加圖像的溫度意味著增加其橙色水平。 它通常使圖像看起來更暖和更快樂，類似于當太陽在其上投射橙色光芒時世界看起來更快樂。 相比之下，降低圖像的溫度使其看起來更冷，更不容易吸引，就像陰天。

色調(diào)和陰影
當您添加黑色時，將顏色添加到白色 - 色調(diào)會導致色調(diào)。 色調(diào)和陰影可讓您通過將不同級別的白色和黑色添加到基本顏色來創(chuàng)建單色配色方案。

例如，如果您的底色是＃8dbdd8（淺藍色），如下圖所示，您可以通過選擇兩個色調(diào)（兩個較亮的藍色）和兩個色調(diào)（兩個較暗的藍色）來創(chuàng)建單色方案。

飽和度，色調(diào)和亮度
飽和度描述了顏色的強度。 飽和度越高，顏色越濃，顏色越深，而飽和度越低，顏色越淡。 當我們說"淺藍色"或"深綠色"時，我們正在描述飽和度的變化。

色調(diào)定義了顏色可以被描述為與紅色，橙色，黃色，綠色，藍色，靛藍和紫色（彩虹顏色）相似或不同的程度。 所以當你描述一種顏色為"綠藍色"時，你用兩種色調(diào)來定義它。

亮度，也稱為價值或色調(diào)，定義了與純白色相比的顏色的感知亮度。

色輪
基本色輪包含用于創(chuàng)建配色方案的12種標準色。 餡餅的每一片代表一系列顏色，可以通過不同的飽和度，色調(diào)，色調(diào)，陰影和相鄰顏色的混合來實現(xiàn)。 組合的顏色（例如，黃色 - 橙色）由混合等量的基礎(chǔ)色調(diào)（黃色和橙色）而產(chǎn)生。

紅色，黃色和藍色是原色。 紫色，橙色和綠色是次要顏色。 其他一切都是第三種顏色，主要和次要顏色的混合。

設(shè)計使用色輪來選擇配色方案，它有四種風格。

4種配色方案
設(shè)計師通過配對色輪中的多個顏色族來創(chuàng)建配色方案。 當您遵循以下某種模式時，這通常效果好。

1.單色
單色配色方案由各種色調(diào)，陰影和單一基色的飽和度組成。 它們非常有凝聚力，但會冒著變得單調(diào)的風險。
2.補充
補色方案基于色輪兩側(cè)的兩種顏色。 因為這兩種色彩會有很大的不同，所以這種方案可以非常有效且引人注目。

專業(yè)提示：為您的號召性用語選擇一種補充顏色。 使用下面的方案，如果您的頁面背景為薄荷綠色，則可以使用粉紅色作為CTA按鈕。

3.類似
類似的方案具有三種顏色，在色輪上彼此相鄰。 由于色調(diào)的相似性，這些方案可以產(chǎn)生非常有凝聚力，統(tǒng)一的感覺，而沒有單色方案的單調(diào)性。

4.三位一體
要制作三色配色方案，請在色輪上繪制等邊三角形（所有三邊長度相同的三角形），然后在三角形的點處選擇三種顏色。 這創(chuàng)造了一個多樣但平衡的方案。

色彩心理學
每種顏色都有其獨特的色調(diào)和意義。 通過仔細選擇你的顏色，你可以加強一個網(wǎng)站的整體信息。

注意：不同文化和地區(qū)的顏色含義可能會有很大差異。 以下描述主要針對美國。

紅色
這種充滿活力和積極的色彩可以根據(jù)具體情況傳達各種含義，但它具有強大的功能和天賦。 將它與黑色結(jié)合為一款男性氣質(zhì)，極具侵略性，適合運動型跑車。 將它與白色和金色搭配，它說明了愛與激情。 紅色也代表危險 - 認為停止跡象 - 和血 - 認為紅十字會。

橙色
溫暖，但不如紅色，橙色很難錯過 - 這解釋了它在建筑，安全和狩獵設(shè)備中的用途。 它也幾乎尖叫秋天，南瓜和萬圣節(jié)。 橙色的溫暖可以喚起有趣而充滿活力的氛圍。

黃色
黃色代表陽光，溫暖和夏季。 這也是光譜中最明顯的顏色，所以它真的會跳出來。 與白色或黑色相結(jié)合時，它尤其引人注目，就像安全設(shè)備，校車和出租車一樣。 盡管如此，盡管如此，請小心，因為很多人都感到不適。

藍色
藍色喚起天體，熱帶和奇怪的專業(yè)。 鑒于它與水的長期聯(lián)系，我們認為藍色是清新和清潔的。 然而，更深的藍色調(diào)可能會引起悲傷。 畢竟，我們稱之為"藍調(diào)"是有原因的。

綠色
作為大多數(shù)植物生命的顏色，綠色表現(xiàn)出增長和健康的感覺，使其成為有機，環(huán)保和健康產(chǎn)品的好選擇。 將它與藍色和棕色相結(jié)合以捕捉自然。 格林在美國也代表財富和金融。

棕色
你不會在網(wǎng)上看到太多的褐色，可能是因為它意味著骯臟。 但如果你想創(chuàng)造一種土質(zhì)感和奢華感，這可能是一個復雜的時尚網(wǎng)站。

紫色
在古羅馬，只有富人才能買得起紫色（這種染料是由蝸牛殼制成的）。 這幾個世紀后，這種聯(lián)系依然很強烈，使紫色成為奢侈品牌的理想色彩。 當與紅色相結(jié)合時，它可以感受到親密和浪漫。 隨著白人和粉紅色，它變得俏皮和孩子般。

白色
白色是關(guān)于純潔，純真和不育的。 你會在專注于婚禮，醫(yī)療保健，科學和靈性的網(wǎng)站上看到它。 它也意味著清潔和新鮮的感覺，如新洗和折疊的床單。

黑色
黑色意味著力量，奢侈，邪惡，死亡和未知。 善與惡之間的戰(zhàn)斗表現(xiàn)為白與黑 - 只看達斯維德和盧克天行者的平時服裝。

顏色工具和資源
由于所有復雜性和靈活性都可以通過顏色設(shè)計進行設(shè)計，因此設(shè)計人員已經(jīng)構(gòu)建了一系列工具來幫助處理流程，這應該不會讓您感到意外。 這里只是我們最喜歡的幾個。

配色方案（調(diào)色板）發(fā)電機
我最喜歡的兩個調(diào)色板生成器可讓您手動選擇每種顏色，或者根據(jù)一種或兩種顏色自動生成它們。

COLOURCODE為單色和互補等方案類型提供了預設(shè)模式，并且您可以將您的方案導出為.scss，.less，圖像或只是永久鏈接。 這也是一個有趣的發(fā)現(xiàn)工具，因為鼠標在屏幕上移動時陰影會更新。

Adobe Color CC，以前稱為"Kuler"，還具有方案類型預設(shè)功能，但增加了COLOURCODE沒有的兩個優(yōu)點。 首先，Color具有內(nèi)置的社交層，因此您可以探索其他人的調(diào)色板。 第二個（也是最優(yōu)越的）是從圖像中提取顏色方案的能力。

調(diào)色板的靈感
偉大的色彩組合需要靈感嗎？ 以下網(wǎng)站使用圖像和設(shè)計來說明不同顏色如何協(xié)同工作。 用它們來幫助指導你的選擇。

顏色使用靈感
需要同行設(shè)計師的靈感？ 除了：

色彩非常重要，星巴克等特許經(jīng)營商對其每個特許經(jīng)營地點的色差都有極低的容忍度。每個加盟商必須從批準的顏色列表中進行選擇。在通向咖啡廳的門打開之前，總部的一位代表將確保墻上的顏色符合嚴格的公差要求。

正確使用顏色，并且您的網(wǎng)站會感覺更加自然并放在一起?，F(xiàn)在你已經(jīng)掌握了基本知識，我鼓勵你繼續(xù)走進色彩理論的道路。但最重要的是，請務必查看正確使用顏色的美麗示例，并練習，練習和練習。

網(wǎng)站名稱：網(wǎng)頁設(shè)計之色彩理論
網(wǎng)頁網(wǎng)址：http://www.muchs.cn/news9/181159.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站制作、面包屑導航、網(wǎng)站設(shè)計公司、網(wǎng)站內(nèi)鏈、網(wǎng)站制作、企業(yè)建站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)