轉換-webkit-過濾色調爲RGB

在CSS3的-webkit-filter允許您通過傳遞0-360轉換-webkit-過濾色調爲RGB

例子之間的度值以應用色調濾鏡：

-webkit-filter: hue-rotate(80deg);

你會如何轉換的程度值轉換爲RGB值？

來源

2013-02-24 Philip Kirkbride

This頁面爲HSL和RGB之間的轉換以及爲這些值提供轉換器提供了極好的指導。

來源

2013-02-24 05:30:32 Bernie

CSS過濾器色調旋轉不是真正的色調旋轉，它是RGB空間中的近似值，對飽和色彩不太準確。如果你想複製它正在做的事情，你需要使用相同的算法 - 這不是標準的HSL/RGB轉換。其基本算法如下：對於type =「hueRotate」，「值」是單個實數值（度）。色調旋轉操作相當於以下矩陣操作：

| R' |  | a00 a01 a02 0 0 | | R | 
| G' |  | a10 a11 a12 0 0 | | G | 
| B' | = | a20 a21 a22 0 0 | * | B | 
| A' |  | 0 0 0 1 0 | | A | 
| 1 |  | 0 0 0 0 1 | | 1 | 

where the terms a00, a01, etc. are calculated as follows: 

| a00 a01 a02 | [+0.213 +0.715 +0.072] 
| a10 a11 a12 | = [+0.213 +0.715 +0.072] + 
| a20 a21 a22 | [+0.213 +0.715 +0.072] 

         [+0.787 -0.715 -0.072] 
cos(hueRotate value) * [-0.213 +0.285 -0.072] + 
         [-0.213 -0.715 +0.928] 

         [-0.213 -0.715+0.928] 
sin(hueRotate value) * [+0.143 +0.140-0.283] 
         [-0.787 +0.715+0.072]

來源

2013-10-14 16:53:16

轉換-webkit-過濾色調爲RGB

回答

相關問題