瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

2023-12-21 17:37:22 來(lái)源/作者: / 己有:0人學(xué)習(xí)過(guò)

網(wǎng)頁(yè)設(shè)計(jì)做得吐了,一直想轉(zhuǎn)行從事UI設(shè)計(jì),拿個(gè)圖標(biāo)練練手,覺(jué)得錘子瀏覽器UI看的舒服,就折騰了做了個(gè),平??戳送Χ嘟坛?,這次也分享下,有更好的方法,歡迎指教。
先來(lái)看一下效果:

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第一步:用矩形工具畫(huà)個(gè)正圓。

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第二步:設(shè)置圓的漸變樣式,數(shù)值如下:

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第三步:設(shè)置圓的內(nèi)陰影

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第四步:畫(huà)中間的圓。

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第五步:畫(huà)中間小圓

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第六步:中間圓加陰影

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第七步:外圓環(huán)

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

第八步:關(guān)鍵的小圓

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

在漸變疊加圖層樣式中,直接鼠標(biāo)拖拉小圓的漸變,直到色彩過(guò)渡協(xié)調(diào)為止

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)

最后加個(gè)大陰影,OK,完工!

瀏覽器UI圖標(biāo)!ps cc模仿錘子瀏覽器圖標(biāo)