Liquid Glass
リキッドガラス / 2025– / 风格 / 苹果 UI
把浮起的控件与导航层统一为一种流动的玻璃材质,折射其下的内容并随之适应。



快速判断
视觉特征
- 动态折射
- 同心的圆角
- 浮起的控件层
- 映出的背景色
适用场景
- 在苹果平台上让内容满幅铺开、只把控件浮在其上的应用
- 浅色、深色与壁纸都会变化,而控件位置必须保持不变的界面
使用这一风格
把简短指引带入项目,或将结构化规格交给AI工具。
详细方法与出处制作规则、真实案例、比较、研究与引用格式
辞典词条
- 字体
- 不要把文字直接压在材质上,最小字号依据实测对比度确定
- 版面
- 把控件靠向屏幕边缘,外轮廓与内侧圆角保持同心
- 材料
- 折射的层只叠一层,让它原样吸收背景的颜色
- 注意
- 只用在控件层,不要拿半透明卡片去装饰内容。层叠得越多,背景透得越厉害,文字终将无法辨读,所以要在真机上确认可读性,并遵守降低透明度的设置。
- 延伸阅读
- Apple Human Interface Guidelines / regular and clear variants / content and functional layers
相关词条
- Glassmorphism (グラスモーフィズム)共同感受:Futurity / Luxury。比较Liquid Glass与Glassmorphism
- Skeuomorphism (スキューモーフィズム)作为有意义的对照由编辑建立关联。比较Liquid Glass与Skeuomorphism
常被混淆的对象
继续浏览苹果 UI
从苹果 UI中按共同感受优先推荐以下词条。
- Brushed Metal (ブラシドメタル)共同感受:Technique / Luxury。
- visionOS Spatial Design (visionOS 空間デザイン)共同感受:Futurity / Technique。
- Aqua (アクア)共同感受:Futurity。
引用此条目
这部辞典就是用来被链接的。请取用适合你写作场合的那一种形式。
- Link
- https://indexstyle.org/zh/styles/liquid-glass
- Markdown
- [Liquid Glass — IndexStyle](https://indexstyle.org/zh/styles/liquid-glass)
- HTML
- <a href="https://indexstyle.org/zh/styles/liquid-glass">Liquid Glass — IndexStyle</a>