返回风格库
Mesh Gradient — Cover

关于网格渐变

2020 年代初,几乎每个 SaaS 官网首屏都长这样:紫、品红、天青、琥珀几团大色块被模糊到彼此融化,在粗黑体标题后面慢慢漂。2019 年前后 Stripe 用 WebGL 做出了会动的渐变,随后 Vercel、Linear 等开发者工具把这团光搬到近乎纯黑的底色上,配白字和毛玻璃卡片。

这套主题照原样保留了那套配方:发光的渐变网格、带 1px 半透明白边的毛玻璃卡、标题里只放一个等宽「工程师」词,下面是安静的 12 栏网格。适合产品发布页、定价页和更新日志。

深入了解网格渐变

来源
全球,以美国旧金山及远程办公的 SaaS 公司为中心
年代
2019–2022; Stripe's WebGL gradient ~2019–2020, glassmorphism named Nov 2020, dark-base gradient heroes peak 2021
代表人物
Michal Malewicz · Kevin Hufnagl · Stripe design team · Linear web team
所属运动
SaaS marketing design · Glassmorphism · WebGL hero backgrounds

网格渐变的设计规格

色板

底色
面
主色
辅色
强调
文字

字体

Hanken Grotesk标题 / 衬线
Inter正文
JetBrains Mono等宽
花 1 积分解锁

按钮、卡片、间距、动效、技法等其余 11 项,解锁后全部展开。可下载 DESIGN.md,也能一键转发给你的 AI。一次解锁,永久有效。

立即注册
已有账号? 登录

气质相近的风格

同样来自设计流派,气质相近。

网格渐变1 积分 · 永久解锁
立即注册
© 2026 Curio