視覺設計 ? 一種配色原則60-30-10方法,如何為界面選擇顏色

一種配色原則60-30-10方法,如何為界面選擇顏色

發表于: 視覺設計. 評論
Sponsor

60-30-10 是一種基本的配色原則,它是指在設計工作中,使用三種不同的顏色來劃分一個整體配色方案,這三種顏色的使用比例為:60%、30% 和 10%。

一種配色原則60-30-10方法,如何為界面選擇顏色

60%色彩比例

這是主色或原色。這是最突出的一個。選擇這種色調時,了解它的含義很重要。它應該反映您的品牌信息。? ? ? ? ?主色或者是原則選擇可以參考一下色彩心理學,不同顏色在人們心中所代表的意義和情感色彩

一種配色原則60-30-10方法,如何為界面選擇顏色

1.紅色:紅色是一種非常鮮明、活潑和有力量的顏色。在色彩心理學中,紅色代表著愛、激情、力量和沖動等情感,它可以激發人的情緒和熱情,但同時也會使人感到緊張和不安。

一種配色原則60-30-10方法,如何為界面選擇顏色

2.藍色:藍色是一種穩定、平靜和清新的顏色。在色彩心理學中,藍色代表著安靜、冷靜、專注和信任等情感,它可以緩解人的緊張情緒,使人感到平靜和放松。

一種配色原則60-30-10方法,如何為界面選擇顏色

3.黃色:黃色是一種充滿活力和熱情的顏色。在色彩心理學中,黃色代表著快樂、溫暖、興奮和創造力等情感,它可以激發人的樂觀和積極心態,但過度的黃色也可能使人感到不安和煩躁。

一種配色原則60-30-10方法,如何為界面選擇顏色

 

4.綠色:綠色是一種平和、安靜和安定的顏色。在色彩心理學中,綠色代表著平靜、健康、成長和自然等情感,它可以使人感到平和和安全,但過度的綠色也可能使人感到沉悶和無聊。

一種配色原則60-30-10方法,如何為界面選擇顏色

5.紫色:紫色是一種神秘、高貴和浪漫的顏色。在色彩心理學中,紫色代表著精神和身體的平衡、創造力和幻想等情感,它可以激發人的創造力和想象力,但同時也可能使人感到孤獨和沉悶。

一種配色原則60-30-10方法,如何為界面選擇顏色

6.橙色:橙色是一種充滿活力、熱情和創造力的顏色。在色彩心理學中,橙色代表著溫暖、熱情、活力和創造力等情感,它可以激發人的樂觀和積極心態,但過度的橙色也可能使人感到焦躁和不安。

一種配色原則60-30-10方法,如何為界面選擇顏色

7.粉色:粉色是一種溫柔、浪漫和柔和的顏色。在色彩心理學中,粉色代表著柔和、溫柔、浪漫和幸福等情感,它可以帶給人們安心和愉悅的感覺,但過度的粉色也可能使人感到過于柔弱和缺乏力量。

一種配色原則60-30-10方法,如何為界面選擇顏色

8.灰色:灰色是一種穩重、成熟和低調的顏色。在色彩心理學中,灰色代表著平靜、安定、成熟和高雅等情感,它可以使人感到冷靜和平和,但過度的灰色也可能使人感到沉悶和無聊。

一種配色原則60-30-10方法,如何為界面選擇顏色

9.黑色:黑色是一種神秘、高貴和穩重的顏色。在色彩心理學中,黑色代表著神秘、高貴、穩重和專注等情感,它可以使人感到冷靜和高雅,但過度的黑色也可能使人感到抑郁和沉重。

 

定主色就可以參考色彩心理學,我認為這種顏色是項目的主色。

一種配色原則60-30-10方法,如何為界面選擇顏色

 

第2步

選擇主要顏色后,您可以使用顏色資源生成接下來的兩種顏色。生成顏色的資源很多,但我使用的是:

 

我常用的在線配色工具,給大家推薦一下,需要的就收藏起來!

 

一種配色原則60-30-10方法,如何為界面選擇顏色

ColorSpace – 調色板生成器和顏色漸變工具

一種配色原則60-30-10方法,如何為界面選擇顏色

Paletton – 配色方案設計師

 

一種配色原則60-30-10方法,如何為界面選擇顏色

Coolors – 超快的調色板生成器!

 

用調色板生成其他的配色組合,可以得到顏色的數據。

 

一種配色原則60-30-10方法,如何為界面選擇顏色

30%色彩比例

這是二次色或互補色。這種顏色的用量是主色調的一半。這用于主要元素,例如文本、輪播和其他重要功能次要顏色支持主要顏色,但仍然足以形成對比。

 

10%色彩比例

這是強調色。這種顏色可用于按鈕、彈出窗口、突出顯示等。明亮、充滿活力的顏色是增加視覺趣味的好方法。它們可以幫助將注意力吸引到頁面的特定區域或使頁面整體感覺更生動。選擇主色后,我將其與其他兩種顏色進行平衡,以生成如下所示的最終設計

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

以下是如何應用此方法的幾個示例:

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

一種配色原則60-30-10方法,如何為界面選擇顏色

 

一種配色原則60-30-10方法,如何為界面選擇顏色

總結

l選顏色的適合要注意顏色的配比,分出強調色、輔助色和主色

l使用顏色生成器可以提高工作效率,而且有理論依據

l多生成幾套顏色,增加選擇的空間

作者:李波

來源:CLD設計研習社(ID:HelloCloud789)

推薦:查看最受歡迎的 301 個設計網站 → http://hao.shejidaren.com
交流:為設計新人提供的設計交流群,請加入UI設計交流群,分享經驗、接單、求職、聊設計。
贊助商鏈接
贊助商鏈接
設計達人微信交流社區:shejidaren888
喜歡這篇文章嗎?歡迎分享到你的微博、QQ群,并關注我們的微博,謝謝支持。
版權:除非注明,本站文章均為原創文章,轉載請聯系我們授權,否則禁止轉載。

{ 發表評論 }