有了這兩個網站,配色新手也能輕松做出好看的漸變!

編者按:這兩年很流行用漸變色,不過新手想做出好看的漸變確實有難度,來看看今天這兩個神器,絕對能幫你輕松搞定。

CoolHue

這幾年大家都喜歡使用漸變色作為背景圖,有一些則會選用高畫質、高分辨率免費圖庫相片,相較于單色背景來說,漸層色看起來更有活力,且目前技術只要通過 CSS3 語法就能將漸層運用到網頁中,不會拖慢網頁載入速度,語法撰寫方式也很簡單,幾乎可以說一段語法就能快速套用背景。

本文要推薦的「CoolHue」是一個相當實用的漸層背景網站,提供大約 30 種不同配色的漸層背景,可以免費下載為圖片格式或產生 CSS3 語法。只要把它加入網站樣式表,就能在任何區域套用漸層色彩。

有了這兩個網站,配色新手也能輕松做出好看的漸變!

STEP 1

開啟 CoolHue 網站后可以看到這些漸層顏色,每個色塊左下角會有兩種顏色色碼。將鼠標游標移動到色彩上方,右下角會顯示「產生 CSS」及「下載圖片」圖標。

有了這兩個網站,配色新手也能輕松做出好看的漸變!

STEP 2

你可以使用傳統方式來下載圖片,獲取某個漸層色背景 500×500 大小的圖片,或者我推薦比較好的方法,直接將 CSS 語法放到網站樣式表就能使用了!一來不用額外下載圖片、減少流量,另一方面在使用或修改上也更為簡單。

有了這兩個網站,配色新手也能輕松做出好看的漸變!

uiGradients

@崔嘎的兔子牙牙樂?:漸變色用得好往往事半功倍,但如果配色難看,做成漸變只會起到雪上加霜的效果,所以本周的設計神器就安利一個在線分享漸變色的網站——uiGradients!全是已經配好的漸變色,每個都很好看,搬來就用,節約了多少一個一個顏色試的時間!

首頁就很養眼有木有:

有了這兩個網站,配色新手也能輕松做出好看的漸變!?

首頁的顏色是隨機的,點擊左右即可切換。還貼(多)心(余)的給每套顏色取了名字… …比如上圖的藍紫漸變就叫Love Couple(愛的CP?)。不是很懂歪果仁的命名方式,有興趣的朋友可以說說你們的理解,說不定和我們的五彩斑斕黑好有一比!

有了這兩個網站,配色新手也能輕松做出好看的漸變!?

點擊左上角即可瀏覽所有顏色,多的數不過來~

更重要的是,它能根據需要的色系進行篩選!從上方的導航欄中選中一個顏色,就顯示出該色系下的所有配色,對于經常需要有針對性尋找顏色的設計師來說是很人性化的功能。

有了這兩個網站,配色新手也能輕松做出好看的漸變!

有了這兩個網站,配色新手也能輕松做出好看的漸變!?

顏色取用也超級簡單,顏色的色值都在上方導航欄里顯示了,點一下就復制了!(看見我的小手手了嗎)

有了這兩個網站,配色新手也能輕松做出好看的漸變!?

?除此之外右上角的導航欄還提供很多real貼心的功能:

有了這兩個網站,配色新手也能輕松做出好看的漸變!

?改變漸變的方向:

有了這兩個網站,配色新手也能輕松做出好看的漸變!

?查看顏色源代碼,只需點擊綠色按鈕,同樣一鍵復制,從細微處省去了不必要的時間。

有了這兩個網站,配色新手也能輕松做出好看的漸變!?

還能一鍵下載為jpg格式。

相比其他配色網站,uiGradients質量好的同時,使用體驗也更加人性化,實用性非常高哦。

而且網站無權限!不用搭梯子!

另:如果你想獲得更多設計工具介紹,除了關注美丫姐以外,還能訪問優設哥的:hao.uisdc.com 設計師導航站,總能找到你想要的。

好啦,今天的神器就介紹這里咯,歡迎同學們關注最充滿智(dou)慧(bi)的設計賬號:

有了這兩個網站,配色新手也能輕松做出好看的漸變!

「配色神器+趨勢都再這了」

  1. 《神器兩連發!谷歌新出的取色小工具+5個常用的色彩靈感網站》
  2. 《2017年最受歡迎的7種色彩風格,全在這篇總結里!》

【優設網 原創文章 投稿郵箱:yuan@uisdc.com】

================明星欄目推薦================

優優教程網 UiiiUiii.com 是優設旗下優質中文教程網站,分享了大量PS、AE、AI、C4D等中文教程,為零基礎設計愛好者也準備了貼心的知識樹專欄。開啟免費自學新篇章,按照我們的專欄一步步學習,一定可以迅速上手并制作出酷炫的視覺效果。

設計導航:國內人氣最高的設計網址導航,設計師必備:http://hao.uisdc.com

收藏 116
點贊 15

復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。