當(dāng)前位置:首頁 > 新聞中心 > 新聞公告
簡約而不簡單!細膩有趣的三色極簡風(fēng)格圖標設(shè)計責(zé)任編輯 :李飛    文章來源 :星翼創(chuàng)想(16qt59sf.cn)    發(fā)布時間 :2015-10-19    閱讀次數(shù):6019

無論是在網(wǎng)站設(shè)計還是在平面設(shè)計上,配色是設(shè)計中永恒的話題。有些初級的設(shè)計師總是喜歡在設(shè)計中使用非常多的顏色種類,以至于設(shè)計出來的效果實在是不忍直視。做為高級的設(shè)計師,高級的設(shè)計師都認為三種色彩構(gòu)成的配色是最平衡也是最漂亮的,多一色顯得太花,少一色又過于樸素,這也是為什么許多配色方案的構(gòu)成多為3種色彩。如果將這種配色美學(xué)運用在最小的UI元素上會是什么效果呢?這就是今天我們要探討的案例:三色圖標設(shè)計。

顏色搭配

三種色彩能夠讓網(wǎng)頁擁有奢華的視覺效果,也可以讓極簡的圖標擁有細膩精致的特征,溫潤致密的質(zhì)感,最大程度地體現(xiàn)色彩本身的優(yōu)勢。

接下來讓我們看看這20個以配色出眾而著稱的圖標設(shè)計方案。

Random Icons by Nick Slater

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

雖然嚴格意義上這套圖標采用了四種藍色,但是其中三種藍色是圖標構(gòu)成的主色調(diào),微妙的色調(diào)選取讓整個圖標設(shè)計趨于一致,又富有細節(jié)。

WP Café del Museo icons by Israel Ortiz

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

淺黃色用作背景,紅色用作圖標設(shè)計的主色調(diào),而綠色則同紅色搭配在一起,起到了輔助和點綴的作用。作為一個以食物為主題的圖標設(shè)計,紅色非常開胃,綠色醒目而自然,堪稱絕配。

Four-Pack by Sebastian Abboud

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

白色勾勒出圖標的輪廓,而深沉的褐色和黑色配合起來有著別樣的美感,細節(jié)豐富而有溫度。

Small Business Club Icons by Andrew Ronaldson

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組圖標的設(shè)計充分運用了圓潤的曲線,黑色構(gòu)成輪廓,紅色點亮整個設(shè)計,而白色則營造出負空間,設(shè)計互補而令人愉悅。

Nationwide Illustrations by Tomomi Sohn

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組圖標設(shè)計的精彩之處在于藍色陰影的選取,白色的底色不僅僅用作襯托而且為圖標營造出空間感,黑色的細線則用來勾勒輪廓但又不會喧賓奪主。

FREEBIES – 42 Flat iOS Icon Set by HevnGrafix Design

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

考慮到需要呈現(xiàn)復(fù)雜的內(nèi)容,這組圖標設(shè)計中的,有的使用的是三種色彩,有的則使用了四種色彩,但是所用色系是非常統(tǒng)一的,主要是橙色、白色和綠色。每個圖標都有著平滑的邊緣和陰影,簡單的設(shè)計營造出3D的質(zhì)感,潛力無限。

Icons by Meg Lewis

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組圖標的設(shè)計也比較有吸引力,黃黑本是經(jīng)典配色,運用在這組圖標設(shè)計中看起來也非常不錯,幾何輪廓的靈活運用讓圖標煥發(fā)出細膩的質(zhì)感。

Kitchen Icons Freebie by Joby Varghese

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這是一套專業(yè)的廚房類可視化圖標,色調(diào)柔和,整體給人以精致的感覺,線條流暢而友好。

Nucleo Food Free by Sebastiano Guerriero

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這也是一個食物相關(guān)的圖標合集,圖標主體也都是采用紅黑雙色設(shè)計,圓潤的線條很好地描繪出食物的細節(jié),紅色部分的點綴作用很明顯,背景使用了類似牛皮紙的色彩和質(zhì)感。

Process Icons / Blog Launch by Garrett Campagna

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組過程圖標的設(shè)計細節(jié)比其他的要更加到位,同樣的紅黑配色在白底上營造出一種復(fù)古的科技感,信息呈現(xiàn)到位。

Rockstar Onesie by Alyssa Welch

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組圖標的設(shè)計也足夠?qū)I(yè),黑色的部分勾勒輪廓,白色填充空間,橙色補充細節(jié)提亮色彩。

Cupcakery Icons by Joash Berkeley

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組圖標看起來非常甜美,不同紅色協(xié)同營造出溫馨有趣的氛圍。

15 Years of Pantone – Upgrade by Annie Ratcliffe

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

藝術(shù)家將每年的年度潘通色彩以圖標的形式呈現(xiàn)出來,黑白中性色構(gòu)成框架,圖標的主題和主要色調(diào)都與當(dāng)年的潘通色相關(guān),點題而應(yīng)景。

Night Mode Icon Set by Jinglu Li

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這個夜間模式圖標的設(shè)計堪稱別出心裁,深藍色和黃色不僅是色輪上的經(jīng)典配色,而且在這里黃色還被非常應(yīng)景地作為提亮色,運用在圖標的視覺元素上,極為精彩的設(shè)計。

Food Allergens Icons by Tunde Szentes

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組食物相關(guān)的圖標設(shè)計營造出自然的氛圍,顏色的選取顯然是深思熟慮之后的結(jié)果,線條圓潤,色彩深淺調(diào)節(jié)得到位。

Free E-commerce Set of 80 Icons by Anton Scherbik

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這是一組簡單漂亮的電商圖標合集,主要色調(diào)是黑色和橙色,充滿了電商的感覺,但是又不顯得單調(diào)。

Icons for UX & Research Company by Diana Wieczorek

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這是一組用戶體驗設(shè)計相關(guān)的圖標設(shè)計,精彩的三色組合和熟練的留白設(shè)計讓這組圖標設(shè)計脫穎而出。黃色部分很好地吸引了用戶的注意力,給嚴肅的主題注入了新鮮的活力。

Youtube Icons by Joseph Wells

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組Youtube 相關(guān)的圖標很好地運用了3D相關(guān)的信息暗示,紅色和藍色很好地結(jié)合到了一起,漂亮的是兩者交叉的地方,看起來新穎而獨特。

Icon Circles by Cody Fitzgerald

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這也是一組藍色為主的圖標設(shè)計,其中的配色也是令人稱道的地方。精彩的配色和充滿生活氣息的主題配合在一起非常和諧,圓形的邊框很好地劃分出視覺邊界,白色的負空間在整個設(shè)計中起到了重要的作用。

Freebie: 16 Line Illustrations by Vincent Tantardini

不一樣的極簡風(fēng)!細膩有趣的三色極簡圖標設(shè)計案例

這組藍色的圖標設(shè)計又是另外的一種風(fēng)格,它更加精致,對于細節(jié)的刻畫也更加貼近實物,給人感覺非常好。白色和藍色的搭配堪稱經(jīng)典,相得益彰。

結(jié)語

三色圖標的設(shè)計非常有意思,做的好的圖標已經(jīng)不僅僅停留在圖標的角色中,許多已經(jīng)可以在頁面中擔(dān)當(dāng)更加重要的插畫的作用了。三種色彩的搭配讓整個設(shè)計立體了起來,擁有了超越單色的立體結(jié)構(gòu)和精彩效果,賦予頁面更加強大的力量。


文章轉(zhuǎn)載請保留網(wǎng)址:http://16qt59sf.cn/news/notice/1518.html

掃碼添加微信
159 8667 8737
24小時電話

返回頂部