微精选

到了2025年，你有没有发现，Dribbble和Behance的首页正在被一种全新的视觉语言刷屏？没错，就是那个伴随苹果iOS 26系统首发的“液态玻璃” (Liquid Glass)。

液态玻璃仿佛给UI图标和窗口赋予了生命，像晶莹剔透的露珠一样悬浮着，边缘流淌着液态的光泽，甚至会随着你的视线和手势发生微妙变化。

不过说实话，以前看到这种图，大多数设计师的第一反应通常是“好看是好看，但做起来太费手”。想在PS里制作液态玻璃效果，光是高光、反射、阴影就能让你叠图层叠到怀疑人生，更别提去AE里渲染材质了。大多数人最后只能放弃，继续用回扁平化。

但设计工具的更新换代，让复杂视觉效果的实现变得轻而易举。国产协同设计工具Pixso近期重磅推出“液态玻璃”功能，将液态玻璃效果直接内置到软件中，只需轻轻一点，同款液态玻璃效果即刻拥有。

今天，这篇文章将带你深入理解液态玻璃的视觉原理，并手把手教你如何用Pixso在几秒钟内快速复刻出苹果级的视觉质感。

Pixso一键生成液态玻璃效果

什么是“液态玻璃”？

物理属性的数字化映射

从物理学角度看，液态玻璃模拟的是高粘度透明流体（如熔化的玻璃、水银或透明树脂）在凝固前一瞬间的状态。在数字界面中，它其实是在玩弄我们的视觉感知，主要靠这三招：

流体动力学：别被这个词吓到，简单说就是“拒绝死板”。它不再用规规矩矩的圆形或方形，而是用那种张力十足、甚至有点不规则的有机曲线，看起来像是自然流淌形成的。

光学折射：就像透过厚玻璃杯看后面的东西会变形一样，液态玻璃会让背景产生错位和焦散，让画面瞬间有了“厚度”。

镜面反射：表面一定要滑！滑到能清晰地映出环境光，那个最亮的高光点，就是质感的灵魂。

液态玻璃 VS 传统毛玻璃

提到液态玻璃，很容易让人联想到另外一种设计手法“液态玻璃”，很多设计师容易混淆这两个概念。为了更直观地区分，我们通过以下对比来看：

理解了这些，你就明白了为什么液态玻璃看起来更精致、更具“未来感”。

如何使用Pixso一键生成“液态玻璃”效果？

我们将抛弃传统繁琐的PS图层样式，直接使用Pixso最新的原生功能。无论你是UI新人还是资深设计师，都能通过以下步骤轻松掌握液态玻璃的制作方法。

设计案例：我们来实操做一个液态玻璃风格的“音乐播放器控制按钮”。

步骤一：搭建基础容器与环境

液态玻璃的通透感非常依赖背景环境。如果背景是纯白色的，玻璃的效果将大打折扣。

绘制背景：在画板上绘制一个矩形，填充一个鲜艳的渐变色，或是从网上搜集现成的渐变图片作为背景。

创建容器：在背景之上，绘制一个圆角矩形。

步骤二：添加“液态玻璃”效果

选中刚才创建的圆角属性容器，将目光移至右侧属性面板的 “效果” 区域。点击 “+” 号，在下拉菜单中找到 “液态玻璃”，即可一键应用Pixso内置的液态玻璃效果。

步骤三：调整液态玻璃参数

点击“液态玻璃”左侧的太阳图标，进入详细参数设置面板。Pixso在这里将复杂的物理光学简化为了几个直观的参数——

• 光源角度/亮度：光线投射到容器上的方向（高光在容器上的着重点）以及高光强度

  

• 均匀光照：光线均匀投射在容器上（容器外框上的高光亮度是均匀的）

• 折射：控制光线沿着容器外框边缘弯曲的方式。折射值越高，就会越明显地扭曲周围的元素

• 深度：改变玻璃材质的厚度外观，以在外框边缘提供更明显的边缘效果

• 色散：增加色散，在外框边缘添加一丝色差效果。与折射结合搭配使用效果更明显

• 模糊：调整液态玻璃框中的背景模糊程度，使玻璃元素在繁杂背景中更加突出，从而提供更好的对比效果

• 亮度：调整液态玻璃效果的整体明亮程度，影响整体光感

• 饱和度：控制液态玻璃效果的色彩强度，可营造鲜艳或柔和的视觉效果

步骤四：进阶叠加——打造苹果级质感

光有一个特效还不够，为了达到iOS系统原生的细腻度，我们需要叠一点“魔法”：

加点模糊：在刚才的液态玻璃特效下面，再叠一个“背景模糊”，数值不用太大，20-30左右。这一步是为了让透过玻璃看到的背景产生一点虚焦，层次感一下就出来了。

添加内阴影：添加一个白色的内阴影，Y轴偏移2，模糊4，混合模式选“叠加”。这能强化顶部的边缘高光。

搞定悬浮感：最后加一个跟背景色系相近的彩色投影，模糊值（Blur）拉大一点，比如40。这样玻璃就像是真的悬浮在空中一样，空气感十足。

此时，你眼前的不再是一个普通的圆形，而是一个晶莹剔透、边缘泛着流动光泽、仿佛具有物理厚度的液态玻璃按钮。

液态玻璃的应用场景：如何在产品设计中用好它？

学会了怎么做，更要学会怎么用。液态玻璃虽然惊艳，但切忌滥用。以下是最佳实践指南：

视觉锚点：图标 (App Icons)

将App图标设计为液态玻璃风格，是目前最流行的做法。它能让图标在主屏幕上像宝石一样凸显出来。

案例：3D工具Spline或MacOS Big Sur风格的图标设计，都大量运用了这种材质。

情感化组件：卡片与悬浮球

在音乐播放器的封面、语音助手的唤醒球、或者Loading加载动画中使用。

避坑指南：可读性第一

千万不要在正文背景、数据报表或密集列表使用液态玻璃。

原因：复杂的折射和光影会严重干扰文字的识别度，违反无障碍设计原则。

法则：“装饰用液态，内容用扁平。”

液态玻璃为何在2025年变得流行？

为什么苹果、微软以及各大头部厂商的设计师开始青睐这种风格？这不仅仅是审美轮回，更包含着深刻的设计心理学。

极致的通透与光感

现在的屏幕素质这么高，Retina、OLED、Micro-LED满大街都是，光放几个扁平色块其实挺浪费硬件性能的。液态玻璃就是为了利用这些屏幕硬件的优势——它利用高光和色散，能在屏幕上制造出一种仿佛光线要溢出来的既视感，这种强烈的视觉刺激能瞬间抓住用户的眼球。

柔和流动的“亲肤感”

扁平化设计看久了，总觉得有点冷冰冰的机械感。但人类天生就喜欢圆润、有光泽的东西。相比于冷冰冰的几何图形，液态玻璃那种软乎乎、毫无棱角、类似果冻或糖果的形态，会本能地给用户传达一种“安全”、“亲肤”的心理暗示。说白了，这种质感会让你下意识地想去戳一下、摸一下，这在无形中就提高了交互的点击率。

维度的跃升

在UI设计中建立层级（Z-index）通常靠阴影。而液态玻璃通过折射率和厚度感，在不使用沉重投影的情况下，依然能构建出清晰的空间关系。它让界面看起来不再是一张纸，而是一个有着丰富景深的微缩世界。

写在最后

从Photoshop时代的图层堆砌，到如今Pixso时代的“一键生成”，设计工具的每一次进化，都是在为设计师的创意工作提质增效。

Pixso的“液态玻璃”功能，其意义不仅在于提供了一个特效，更在于它降低了高级视觉表现的门槛。它让每一位产品设计师、UI设计师甚至产品经理，都能在几秒钟内赋予界面灵动的特性，不再需要羡慕iOS概念视频里的炫酷效果，因为现在借助Pixso，你也可以在自己的设计稿中轻松实现！感兴趣的朋友，快去打开Pixso尝试一下吧！