漸變教程,如何做出迷人的漸變?

2022-12-26 18:07:22 來(lái)源/作者: / 己有:7人學(xué)習(xí)過(guò)

  A色 B值非常高,普遍50以上

  從A色到B色,H值的變化范圍為正負(fù)30到70,S值減少10,說(shuō)明B顏色略變淡。

  從B色到C色,H值的變化范圍為正負(fù)30到40,S值增加15到50,說(shuō)明C顏色開(kāi)始變濃。

  以上色值僅供參考,實(shí)際使用并非整數(shù)。根據(jù)以上規(guī)律去有規(guī)則的使用漸變色。

  二、垂直線性漸變 + 球形漸變

  Web界面面積比較大,在大面積使用漸變的時(shí)候。如果只是使用垂直的線性漸變是略顯單調(diào)的,這個(gè)時(shí)候我們需要加一個(gè)球形的漸變。

漸變教程,如何做出迷人的漸變?

  A+B+C色構(gòu)成一個(gè)漸變,這時(shí)候我們?cè)傺a(bǔ)充一個(gè)D色的球形漸變并高斯模糊。D色的圓形矢量形狀要轉(zhuǎn)換為智能對(duì)象,這樣調(diào)節(jié)高斯模糊及大小的時(shí)候可以無(wú)損調(diào)整。如果界面上需要運(yùn)用圖片,我們?cè)傺a(bǔ)充一個(gè)80%透明度的E色,疊加在去色后的圖片上。這樣界面會(huì)層次會(huì)更加豐富。

  三、多角度球形漸變

  想讓界面更加絢麗,這時(shí)候我們可以考慮多組球形漸變搭配使用。例如最新改版的instagram就是一組線性漸變,加兩組球形漸變組成。球形漸變也是由多組顏色構(gòu)成。

漸變教程,如何做出迷人的漸變?

  四、色塊漸變

  漸變的顏色不只可以運(yùn)用在一個(gè)色塊上,還可以運(yùn)用在一組色塊上。設(shè)計(jì)師運(yùn)用一組近似性色彩,將每個(gè)菜單項(xiàng)清晰區(qū)分開(kāi),讓界面平衡在一個(gè)頻率上,這樣的畫(huà)面更有節(jié)奏感和舒適性。

漸變教程,如何做出迷人的漸變?