DIV CSS 佈局教程網

Step 10

我們回到深色背景，有沒有感覺到信封的兩邊顯得有點平？我們用一個Bars或者Radial填充來加點效果上去。

Step 11

接下來為信封的上下三角形加單像素高光，因為之前已經反復講過路徑相減（Punch Path，您可以在Modify – Combine Paths菜單下找到它）的操作，這裡不再作說明，如下圖：

Step 12

同理給下面的三角形加高光。

Step 13

因為背景是比較深的顏色，我們可以考慮加個發光。這裡我們不去用FW的投影或發光濾鏡，還是用Path，為什麼？因為比較好控制，個人喜好吧。我們可以做一個比信封底層的圓角矩形上下左右多1px的新圓角矩形，不羽化，透明度30。

Step 14

再在加一道1px高光在下面。

Step 15

至此圖標基本完成，下面進入潤色階段。我們把所有圖層全選“復制”一份，然後迅速按下Ctrl+Alt +Shift+Z把圖層平面化為位圖，然後設置疊加方式為Overlay，透明度60，這樣就會發現圖標的飽和度、對比度被提高了，這是我個人比較喜歡的快速潤色的方法，但並非任何時候都適用，某些時候你必須手動用FW自帶的濾鏡去調曲線、對比度、飽和度等參數。

Finish

最終效果（其實信封下方的三角我也用路徑加了Path作為投影，寫完了才發現，我就不再折騰了……）