颜色渐变

颜色渐变（有时也叫颜色带）是指一定范围的随之位置而变的颜色，通常用于填充某一个区域。渐变产生的颜色随位置连续变化，产生平滑的颜色过渡。

在网页设计中，渐变可以依其形状可以分为线性渐变、径向渐变和锥形渐变，每个渐变由多个色标组成，各个色标都有各自的颜色（含不透明度）和位置。渐变在色标之间进行平滑颜色过渡，因此还需要指定颜色的插值方式。

 定义 

在数学中，渐变可以以函数的形式表示，其中r是实数，c中色彩空间中的一个点。

其中：
 色彩空间C
 采样点的递增序列
 颜色空间内的一系列值 
 映射
 中间值的插值规则

其中：
 r是实数
 是实数集
 c是色彩空间C中的颜色点

 类型 
渐变可以按照不同的分类标准进行分类。例如，根据维度来划分，渐变可以是一维、二维或者三维的。而根据形状划分，渐变可以是线性渐变、径向渐变和锥形渐变，甚至是其他一系列形状的渐变。此外，不同的渐变还可以有不同的颜色深度和颜色插值模式。

 依形状划分 
 线性渐变 
线性渐变（），有时也称为轴向渐变（），是指沿着一个直线进行过渡的渐变。在数字图像系统中，颜色通常都是以RGB色彩空间进行插值的。CSS和SVG都支持线性渐变Linear Gradients  in "CSS Image Values and Replaced Content Module Level 3", W3C Candidate Recommendation, April 2012Linear Gradients  in "SVG 1.1 (Second Edition)", W3C Recommendation, August 2011。

 径向渐变 
径向渐变（）是指依照圆形由中心到边缘进行过渡的渐变，其颜色根据距离中心的位置进行线性插值。CSS和SVG都支持径向渐变。在CSS和SVG中，径向渐变可以是圆形，也可以是椭圆Radial Gradients  in "CSS Image Values and Replaced Content Module Level 3", W3C Candidate Recommendation, April 2012Radial Gradients  in "SVG 1.1 (Second Edition)", W3C Recommendation, August 2011。

 锥形渐变 

锥形渐变（或），是指颜色围绕一个中心点进行旋转的渐变。锥形渐变的例子包括饼图和色轮。

其他形状
在矢量图形中，可以使用多边形的渐变，例如在Adobe Illustrator中支持多边形网格（）。

 色彩空间 

 色彩空间的效果
渐变的外观不仅取决于颜色本身，还会受到颜色空间的计算方式的影响，这一问题主要影响以下两个方面：

 对色彩空间的伽玛校正。当γ值约为2时，很容易看到启用了gamma的颜色空间会把颜色混合得深一些，这是由于两个数的平方和不会超过其和的平方。这一效果在混合互补色时尤为明显，例如红色和绿色，其颜色的中间值会是更深的颜色，而不是预期的黄色。
 处理其他的感知属性。在信息的可视化中，让渐变能够平衡地过渡亮度和饱和度是不现实的，这是因为人类感知会强调其品质，导致一些偏差和误解。

长期以来，线性的混合方式是游戏引擎的标准。而在网页中，混合方式往往会在颜色渐变和图像缩放中忽略。这种混合与在感知均匀的颜色空间中进行的混合仍然有细微差别。

 例子 

HSV彩虹 

 参考文献 

 参见 


 色彩带
 色调分离


Category:计算机图形学