最近设计群里总有萌新反复问一个问题：液态玻璃设计怎么做？什么软件可以做？
一开始大家默认答案都是Figma，但实际用下来发现它能做是能做，但不是对所有人开放，免费版用户是没法用的。所以今天就和大家一起聊聊：
液态玻璃这波风格到底是怎么火起来的
除了Figma，还有哪些UI设计工具能做液态玻璃
UI实操案例，手把手教你学会液态玻璃效果
一、液态玻璃设计是怎么火起来的？
说起这波液态玻璃，源头还得是iOS。还记得当初刚出来时，群里一片吐槽，以前有多嫌弃，现在就有多香。从拟物、扁平到新拟态、毛玻璃，再到现在的液态玻璃设计，这类风格其实一直在往“更像真的”那个方向靠。
但这次液态玻璃不太一样，它不只是视觉样式，更像是在模拟真实的光学效果。
它有几个特点：
背景不是单纯模糊，是会“扭曲”的
边缘会有轻微红蓝偏色（色散）
高光会跟着光源变化
滚动页面的时候，内部内容有“流动感”
仔细看像是一块“有厚度的透明材质”，不是干瘪的平面。有很多设计师用传统的方式，模糊+透明+阴影，怎么做都差点意思。
二、除了Figma，还有哪些液态玻璃设计工具？
聊工具，大家第一反应肯定都是老大哥Figma。确实，它在2026年正式上线了原生的液态玻璃功能，面板里直接丢给你光源、折射、深度、色散，还有一个特别好用的“霜冻模糊”。这些参数叠在一起，效果确实很顶。但它属于付费能力，而且对新手来说参数理解成本高，不如找些平替工具做练习。
1. Pixso：综合体验均衡
在国内团队里用的话，我自己更常用的是Pixso。因为它的完成度和操作逻辑跟Figma最像，但在光源控制上又有自己的小巧思。
它的液态玻璃支持“角度”和“均匀”两种光源类型。这个设计其实很懂UI设计师，有时候我们需要明确的顶光（选角度），有时候我们需要四周都有泛光的高级感（选均匀），它直接帮你切分好了。深度、色散、模糊这些调节选项全都有，操作上比较直接，基本是给容器加一个效果，然后再慢慢调参数。
2. 墨刀设计：新手容易上手
如果你是刚开始接触液态玻璃设计，或者本身就在用这个原型工具，那墨刀设计也不落后。它也上线了一键开启的液态玻璃功能。常用的几个参数基本都有，调起来不复杂。
最让我觉得实用的点在于它的“组件化”。你在墨刀里调好一个完美的液态玻璃卡片后，直接存为组件，团队里其他人拖出来就能用，对于统一设计规范来说特别省事。不需要每个人都去学怎么调光影参数，门槛压得很低。
3. Spline：参数多但更偏实验型
做3D的同学对Spline肯定不陌生。他们家也推出了一个偏2D体验的工具叫“Hana”，里面直接内置了液态玻璃效果。打开Hana的参数面板我直接懵了，参数给的实在太丰富了。什么色散、放大率、折射偏移，它甚至还支持“内部色散”这种很变态的光学参数。
但它的边缘处理有点迷。在做折射的时候，边缘经常会出现透视畸变，看着有点奇怪。而且它少了一个很关键的东西——高光。这就导致如果你的背景是一块纯色或者对比度比较低的图，这块玻璃就隐身了，可视性比较差。属于是可以拿来玩耍，但在严谨的UI业务线里用起来有点提心吊胆。
三、液态玻璃设计怎么做？实操案例
工具说完了，简单走一遍实操，分享一个我用Pixso做液态玻璃设计的实操流程，其实很简单：
新手跟练先准备一个有信息量的背景，找个细节多的背景图，插画、3D渲染图都行。别用纯色，玻璃基本没东西可以折射，你看不出来效果。
重要步骤是，先在背景上画一个容器，不是普通矩形，记得圆角要统一。画好后，把填充色改成纯白，透明度降到20% - 30%左右。
然后开始添加液态玻璃效果，选中这个半透明容器，在右边的属性面板。添加效果，选择「液态玻璃」效果，这时候基本的立体感就出来了。
想让它更高级？那就调参数注入灵魂。不用全调，重点是这三个：折射、深度和色散。折射决定扭曲程度，深度是玻璃的厚度，一般中等值就够了，不要太厚。色散就是控制边缘有没有类似彩虹光晕的质感，注意色散宁可没有，也不要过多。如果你想调整高光位置，切一下光源角度就基本成型了。
结语
现在做液态玻璃，更重要的是你用什么方式去做。有的人还在叠图层，有的人已经开始直接调参数了。作为设计师，其实不用去死盯着某一个软件。Figma的液态玻璃确实很全面，但如果它的付费门槛对你来说比较高，选一个顺手的工具跑通一遍，比什么都重要。
#液态玻璃##液态玻璃设计##UI设计##Figma##设计工具##UI设计工具##液态玻璃效果##液态玻璃UI##Pixso##墨刀设计##教程#
