渐变Gradient
你可能会说
背景别用纯色，让颜色从蓝慢慢过渡到紫。
渐变是一种让两个或多个颜色在指定方向或范围内连续过渡的视觉效果线性渐变适合形成方向感，径向渐变可把注意力聚到一个区域，例如产品页的背景光晕。颜色感受会随明度、面积和品牌而变化；文字覆盖在渐变上时要检查整段区域的对比度，并准备可读的纯色回退。
组成结构 · Anatomy
⟶
渐变从它开始
线性渐变的角度，决定流动感
中途的停靠色，能做三色以上
渐变到它结束
常见变体 · Variants
线性渐变Linear
Hero 背景，方向感带来活力
径向渐变Radial
聚焦主体，营造光晕氛围
双色调Duotone
年轻潮流的品牌活动页
同色系深浅Tonal
想保持克制、又需要轻微层次时
典型使用场景
Hero 区大背景
品牌活动页
图标与头像点缀
消息
＋
林
林小满 把终稿发你了
10:24
✦
灵感订阅 本周精选已更新
09:02
卡片微渐变底色
本月活跃用户
12,408
↑ 8.2% 较上月
平均停留时长
6分42秒
↑ 3.1% 较上月
延伸阅读 · 权威出处