photoshop繪制碳纖維風(fēng)格的網(wǎng)頁(yè)導(dǎo)航按鈕

制作背景

新建1200 x 600px，透明背景的文檔。設(shè)置前景色為#bebebf，背景色為#d2d2d2。



選取”漸變工具”從畫布頭部到底部進(jìn)行線性漸變。



使用如下設(shè)置添加”雜色濾鏡”（濾鏡- 雜色- 添加雜色）



接著添加”模糊濾鏡”（濾鏡- 模糊- 動(dòng)態(tài)模糊）



在畫布左右邊沿有些太過(guò)的動(dòng)感模糊效果，這不是我們想要的，簡(jiǎn)單的用裁剪工具進(jìn)行裁剪，去除兩邊不好的動(dòng)感模糊效果區(qū)域。



這樣你會(huì)得到一個(gè)輕柔的金屬感的背景，可以再次通過(guò)調(diào)整動(dòng)感模糊設(shè)置來(lái)使金屬感看起來(lái)更和諧。
創(chuàng)建導(dǎo)航

選取圓角矩形工具，設(shè)置半徑為10px，在畫布中央拖出如下所示的矩形（663*136）。



完成后，設(shè)置如下圖層樣式：

內(nèi)陰影



漸變疊加






描邊






效果如下：



接下來(lái)，我們將制作碳纖維圖案，新建4 x 4px的文檔，放大到3200%，像下圖一樣給8個(gè)格子填充不同顏色。

（提示：借助標(biāo)尺，把文檔分成8個(gè)格子，再新建2 x 1px的文檔，按以下顏色進(jìn)行填充，填充好后復(fù)制到4 x 4px的文檔，這樣的話要復(fù)制8次哦）



圖案完成后，去往菜單”編輯- 自定義圖案”，給新圖案命名，然后回到制作導(dǎo)航欄的文檔中。

選擇”矩形”圖層，鼠標(biāo)指向矩形的”矢量蒙版縮略圖”，按住ctrl，進(jìn)行單擊，已選中整個(gè)矩形，此時(shí)新建圖層，保持選區(qū)不變，選擇”油漆桶”，用新圖案填充選區(qū)，效果如下所示：



接著把新圖層的混合選項(xiàng)更改為”差值”。結(jié)果又不一樣，有碳纖維的感覺(jué)了：



創(chuàng)建導(dǎo)航按鈕

選擇”字體工具”，在矩形底部編寫導(dǎo)航鏈接。




然后給字體設(shè)置如下圖層樣式。

陰影



顏色疊加



在鏈接之間添加分隔線，兩條1px的直線相鄰，左邊的為黑色，右邊的為白色，完成后給此圖層設(shè)置透明度為50%，混合選項(xiàng)為”柔光”。