Figma入门-磨砂后果

Figma入门-磨砂后果

弁言

在之前的事情中，各位的原型图都是使用 Axure 制造的，印象中 Figma 不休是个专业计划软件。

迩来，很多产物伙伴报告我，很多原型图都开头用Figma制造了，并且很多组件都是内置的，对种种原型图的制造极度友好，只需熟习一下基本的利用即可上手。

以是我方案一探求竟，听说的毕竟是听说，本人上上手才是真的。

以是接下去的文章我方案纪录从0开头上手 Figma 的历程。

本系列直接从实操开头，有所错漏大概利用错误，还请各位指正。

假如有更高效的使用办法，也接待交换。

本篇我们来讨论如安在 Figma 中制造磨砂后果，这是一种稀有的半纯透毛玻璃质感，在古代UI计划中被广泛使用于卡片、背景和图标等元素中。

绘制

这里我们以磨砂图标为示例，经过一步步的利用来学习和绘制出磨砂后果。

在这个历程中，我们将学习到基本图形的绘制、徐徐色的使用、边框后果的添加以及最紧张的磨砂后果的完成办法。

这个案例不仅能协助我们把握磨砂后果的制造本事，还能让我们熟习 Figma 中的一些基本利用和常勤奋效。

我们以最开头做的谁人图标为例：

起首我们先给它放一个底色的矩形

然后我们给星形添补颜色，这里选择了线性徐徐，徐徐角度为斜角，添补色范围#57B0FF~#043CA5，这里不必太在意具体的颜色，大抵像那么回事就行，在收尾阶段我们还会对颜色做进一步伐优。

接下去经过描边功效，给星形添加高光后果。

依照本人的喜好调停好边框颜色，经过 Ctrl Alt C 复制这个星形的样式， 并选中正中的环形按 Ctrl Alt V 粘贴复制好的样式。

把星形的后果设置为背景含糊来模仿磨砂后果。

新增一个箭头，把星形的添补，设置其 殽杂形式 为 叠加，取得如下后果。

最初再调停下各元素的颜色、边框和纯透度，取得如下后果。

至此我们完成了这个图标磨砂后果的绘制。

总结

在上述历程中，我们起首构建了图标的基本外型，完成图标主要构成元素的绘制。

然后对图标举行开头添补徐徐颜色，接纳边框线来完成矩形的高亮后果，学习到元素属性样式的快捷复制办法。

最初使用 殽杂形式 的 叠加和调停元素添补色的纯透度完成了磨砂后果。

– 接待点赞、眷注、转发、保藏【我码玄黄】，各大平台同名。