如何使用 Figma 制作毛玻璃主题的 Icon

教程介绍

毛玻璃效果是一种流行的设计风格，能够为您的图标和 UI 元素增添时尚感。UIED提供一篇详细教程，教您如何在 Figma 中制作毛玻璃主题的 Icon。如果您喜欢这种效果，可以跟着教程多试试。

教程链接：如何在 Figma 中制作毛玻璃主题的 Icon

制作步骤

第一步：创建图标

1. 打开 Figma，创建一个新的画板。
2. 选择形状工具（矩形、椭圆、星形等），绘制您想要的图标基础形状。
3. 添加细节，使用画笔工具或其他形状工具，为图标添加更多细节。

第二步：添加毛玻璃效果

1. 选择图标形状，然后复制一份形状。
2. 将复制的形状放置在图标的后面，作为背景。
3. 应用填充：选择背景形状，点击右侧面板的填充选项，选择一个颜色并将不透明度降低到20%到50%之间，具体取决于您希望的毛玻璃效果强度。
4. 添加模糊效果：在右侧面板中，找到“效果”选项，添加一个“背景模糊”效果，调整模糊强度到合适的数值（通常为 10 到 20 像素）。

第三步：优化和调整

1. 调整颜色和不透明度，确保图标和背景形状的对比度合适，使图标清晰可见。
2. 添加阴影和高光：为了增加毛玻璃效果的真实感，可以在图标上添加一些阴影和高光。
3. 细节优化：根据需要，进一步调整图标的形状和效果，使其达到最佳视觉效果。

第四步：导出图标

1. 选择图标和背景形状，确保它们组合在一起。
2. 右键点击，选择“导出”，根据需要选择 SVG、PNG 或其他格式，导出图标。