将十六进制或rgb颜色转换为fecolormatrix值

时间:2013-10-07 17:46:59

标签: css3 svg svg-filters

我完全不知道SVG,但我在我的网站上运行了一个脚本,通过应用svg颜色过滤器在颜色和B + W之间切换图像,然后在悬停时将其删除。颜色的色调似乎是使用下面显示的值矩阵设置的......

 <feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0"/>

我的问题是我想改变滤镜的颜色,使其具有非常轻微的棕褐色调,而不是目前的纯B + W.我不敢相信没有人创造过RGB或十六进制颜色转换器,但谷歌似乎没有变成一个 - 也许我在寻找错误的东西?我该怎么做呢?我曾经听说它是在插画家中完成但我不使用插画家。有在线转换器还是可以在photoshop中完成?

2 个答案:

答案 0 :(得分:1)

我认为你误认为feColorMatrix的功能。您没有从颜色矩阵中获得单一输出颜色,输出​​取决于R,G和B颜色的组合。

Read the web platform docs on feColorMatrix.

您可以使用我制作的this color matrix demo来播放棕褐色设置。

答案 1 :(得分:0)

有一个webkit过滤器,恰好是棕褐色。 它有一个参数来指定(棕褐色过滤的)量,等价物是:

<filter id="sepia">
  <feColorMatrix type="matrix"
    values="(0.393 + 0.607 * [1 - amount]) (0.769 - 0.769 * [1 - amount]) (0.189 - 0.189 * [1 - amount]) 0 0
            (0.349 - 0.349 * [1 - amount]) (0.686 + 0.314 * [1 - amount]) (0.168 - 0.168 * [1 - amount]) 0 0
            (0.272 - 0.272 * [1 - amount]) (0.534 - 0.534 * [1 - amount]) (0.131 + 0.869 * [1 - amount]) 0 0
             0 0 0 1 0"/>
</filter>

取自here

的信息