Glassmorphism

磨砂玻璃是 Apple 发布会的光影魔术——多色光斑在背景流转,半透明的磨砂卡片浮在上面,像一层薄雾后的彩色世界。这个风格用模糊和透明创造深度,用光和影编织高级感。每一帧都可以是一张壁纸。

arcsin1 f02154c 3 files · 4.9 KB Updated

File contents

磨砂玻璃是 Apple 发布会的光影魔术——多色光斑在背景流转,半透明的磨砂卡片浮在上面,像一层薄雾后的彩色世界。这个风格用模糊和透明创造深度,用光和影编织高级感。每一帧都可以是一张壁纸。

配色

标题 #0f172a 深墨、正文 #334155 石板灰,强调色 #818cf8 柔紫与 #06b6d4 青蓝是光斑的两种颜色。背景 linear-gradient(140deg, #c7d2fe 0%, #e0e7ff 45%, #cffafe 100%) 是薰衣草到浅青的三段渐变,如光斑的底色。卡片 rgba(255,255,255,0.46) 高度透明的磨砂质感,边框 rgba(255,255,255,0.55) 是半透明白色描边。

排版

现代无衬线字体,细字重,标题轻盈地浮在磨砂卡片上。正文保持简洁,字号不过大。文字与磨砂背景的对比靠 backdrop-filter 而非纯色底。

布局

磨砂卡片浮在多色渐变上,backdrop-filter: blur 创造深度感。卡片之间可以有重叠,增加层次。大圆角和柔和阴影保持轻盈感。

动画

blur-in、shimmer-sweep、gradient-flow

适合场景

Apple 式产品发布、高端品牌展示、设计系统介绍、产品特性亮点——需要传递「高级感不需要解释」的场合。

配图

不支持配图。

不要

  • 不要使用实色背景或硬边框
  • 不要丢掉磨砂模糊的核心效果
  • 不要让卡片变得不透明
  • 不要用过多的内容填满磨砂的呼吸空间

arcsin1/oh-my-ppt/tree/main/resources/styles/glassmorphism commit f02154c88f

Frequently asked questions

npx skillmds@latest add arcsin1/glassmorphism