01 單色配色的定義
大多數的設計項目都傾向于使用多色調進行搭配,獲得豐富的視覺層次,但有些時候畫面只使用少量顏色也可以做出優秀的設計。
單色并不是指只有一種顏色,而是只有一種色相。單色配色是只使用一種色相進行色彩搭配的方法。單色搭配雖然沒有形成顏色的對比,但色相中卻有著無數的色調變化,利用同一色相中純度、明度的層次變化,也可以形成良好的視覺效果。
單色配色其實并不意味著單調,單色配色在很多設計項目中,都呈現出了極具表現力的一面,優秀的單色配色并不一定弱于多色配色。
在單色配色中,經常會使用一些無彩色(黑白灰)用于文本、背景和裝飾元素來豐富畫面層次。
使用紫色細微的漸變對比,畫面形成豐富了的明暗層次,紫色的明度較低,可以很好的承載白色文字信息
使用黑色作為背景,可以很好的襯托出綠色主體,給人一種深邃、神秘的視覺感受。
02 單色配色的優點
對于新手設計師來說,顏色越少畫面越容易把控,色彩層級越精簡,就越容易達到整體色彩平衡。單色搭配可以產生低對比度的和諧美感,視覺上形成協調統一的感覺。
不需要使用過多的顏色,通過藍色明度的層次變化,畫面也可以很豐富,能很好傳達出智慧、科技的主題。
以企業形象色為主色調進行設計,使設計的畫面具有統一的色彩,還可以向人們傳達出強烈的品牌效應。
單色配色簡約大氣、色調干凈統一且穩定,容易營造出和諧與平衡的感覺,是較容易掌握的配色方法。
03 單色配色的方法
①使用HSB模式建立配色方案
HSB色彩模式是將顏色三屬性進行量化,色相H以角度(0°-360°)表示,飽和度S和亮度B以(0%-100%)表示。
在確定基礎色相(H)之后,可以通過調整飽和度(S)和亮度(B),來創造一套富有層次的配色方案。
此案例以“H:255”為基礎色建立配色方案。
使用此方法可以得到同一色相中大量的色彩樣本,但這并不意味著你需要在單色配色中使用很多顏色,一般選擇3、4種足以。
接下來需要考慮色彩的明暗和飽和度,調整這些屬性,讓配色更貼合你的設計目標。
由于單色配色色彩的對比度沒有多色配色那么明顯,同一配色方案內不同的顏色之間,需要形成明暗變化,構成一個階梯型的色階。
②使用配色工具輔助配色
目前有大量的配色網站可以用來輔助配色,對于配色基礎薄弱的新人會有很大的幫助。在這里給大家推薦的是Adobe公司出品的一款極為高效的在線配色工具:Adobe Color。
在Adobe Color中,使用色盤設置了基礎顏色之后,另外四個關聯顏色會自動生成。
在調色規則中選擇“單色”。使用橙色為基礎顏色,會自動生成四個關聯顏色,篩選適合的顏色配置到畫面中,就能很快完成配色方案:
再看一個案例,根據主體最顯眼的紫藍色為基色,按照生成的配色方案,篩選適合的顏色配置到畫面中,這樣的配色會非常協調統一。
04 總結
單色配色是較容易掌握的配色方法。單色搭配雖然沒有形成顏色的對比,但利用同一色相中飽和度、明度的層次變化,也可以形成良好的視覺效果。
單色搭配可以產生低對比度的和諧美感,視覺上形成協調統一的感覺。在單色配色中,經常會使用一些無彩色(黑白灰)用于文本、背景和裝飾元素來豐富畫面層次。
原文地址:藝海拾貝Design(公眾號)
作者:鄧海貝
轉載請注明:學UI網》單色配色也能玩出這么多花樣?
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務