颜色混合模式


把 rgb 三通道各通道的值放在 0-1 之间
白色:(1, 1, 1)
黑色:(0, 0, 0)

multiply 正片叠底
将2个颜色相乘,得到一个更暗的颜色
效果像将2张图片打印在透明薄膜上

screen 滤色
反转2个颜色然后相乘,最后再反转
效果像将2张图片投影到屏幕上

overlay 叠加

如果底部颜色较暗则最终颜色是 multiply 的结果,如果底部颜色较浅则最终颜色是 screen

darken 变暗
最终颜色由2个颜色的各通道的较暗值组成

lighten 变亮
最终颜色由2个颜色的各通道的较亮值组成

color-dodge 颜色减淡
最终颜色是将底部颜色除以顶部颜色的倒数的结果
A black foreground leads to no change. A foreground with the inverse color of the backdrop leads to a fully lit color.
This blend mode is similar to screen, but the foreground need only be as light as the inverse of the backdrop to create a fully lit color.

color-burn 颜色加深
最终颜色是反转底部颜色,将值除以顶部颜色并反转该值的结果
A white foreground leads to no change. A foreground with the inverse color of the backdrop leads to a black final image.
This blend mode is similar to multiply, but the foreground need only be as dark as the inverse of the backdrop to make the final image black.

hard-light 强光
如果顶部颜色较暗,则最终颜色是 multiply 的结果,如果顶部颜色较浅则最终颜色是 screen 的结果
This blend mode is equivalent to overlay but with the layers swapped.
The effect is similar to shining a harsh spotlight on the backdrop.

soft-light 柔光
The final color is similar to hard-light, but softer.
This blend mode behaves similar to hard-light.
The effect is similar to shining a diffused spotlight on the backdrop.

difference 差值
较亮的颜色减较暗的颜色

exclusion 排除
The final color is similar to difference, but with less contrast.

hue 色相
最终颜色具有顶部颜色的色调,同时使用底部颜色的饱和度和亮度

saturation 饱和度
最终颜色具有顶部颜色的饱和度,同时使用底部颜色的色调和亮度

color 颜色
最终颜色具有顶部颜色的色调和饱和度,同时使用底部颜色的亮度

luminosity 明度
最终颜色具有顶部颜色的亮度,同时使用底部颜色的色调和饱和度