扁平化設計持續熱門，但想做出有層次、有質感的半透明圖標，光影簡單不代表容易——難點在於半透明疊加樣式的精準控制與低純度色彩的協調。這篇教學完整拆解從底圖到成品的每一步參數，適合想進階 UI 圖標設計的你。

最終效果預覽

一組清新半透明的圓角矩形圖標，內含多層幾何圖形，光影呼應統一，色調柔和高級。

核心製作流程

步驟 1：建立基礎底圖

• 新建畫布（尺寸自訂），用圓角矩形工具繪製主形狀。
• 添加圖層樣式 → 漸變疊加 + 投影，參考下圖參數，奠定立體基底。

步驟 2：構建中層幾何結構（三圖層疊加）

• 分三個圖層繪製中間形狀，對應關係見圖。
• 紅點標註的兩圖層參數相同，採用內陰影 + 內發光營造凹陷感。

步驟 3：正圓形圖層樣式細節

• 套用內陰影 + 內發光，參數微調至邊緣自然過渡。

步驟 4：群組統一投影，收尾

• 將三形狀圖層成組（Ctrl+G），在群組上添加投影，統一光源方向。

延伸變化與心得

掌握半透明疊加邏輯（填充 0% + 圖層樣式）後，可快速衍生出同風格不同形狀的圖標系列（如圓形、六邊形、異形），色彩只需調整漸變疊加的色相即可。低純度配色建議參考 Material Design 色盤 200–300 階，不易翻車。

動手做一組屬於你的半透明圖標包吧！