跳转到内容

设计与体验 · DEFINED TERM

Gradient 渐变

在两个或多个颜色停靠点之间平滑过渡。

你可能会这样说“只在品牌强调区域使用轻微渐变,不铺满所有卡片。”

VISUAL EXAMPLE

先看懂它怎么工作

INPUT只在品牌强调区域使用轻微渐变,不铺满所有卡片。
定义方向与色标
浏览器插值
裁切到目标区域
CHECK颜色过渡自然,文本对比度稳定,降级时仍可读

MECHANISM

运行机制

  1. 定义方向与色标
  2. 浏览器插值
  3. 裁切到目标区域

USE WHEN

适合这样用

背景、强调和数据区间表达

NOT FOR

不要这样理解

渐变不能代替真实图片或信息结构

TELL YOUR AGENT

可直接发给 Agent

请按“Gradient 渐变”的概念处理这个需求:只在品牌强调区域使用轻微渐变,不铺满所有卡片。。先说明实现边界,再给出可检查的结果。

ACCEPTANCE

怎么确认它真的做好了

颜色过渡自然,文本对比度稳定,降级时仍可读

OFFICIAL SOURCES

官方来源