Skip to main content
1 of 4
Temani Afif
  • 263.7k
  • 27
  • 345
  • 457

To understand the why we need to perform some math.

If we start with the invert(1) (the easiest one) we will use f(x) = (255 - x)ref. So rgb(255,0,0) will become rgb(0,255,255)

For the hue-rotate(180deg) it more complex. Considering the specification we will get the following matrix:

-0.574  1.43  0.144
 0.426  0.43  0.144
 0.426  1.43 -0.856

So we will have

R' =  -0.574*R  1.43*G  0.144*B = 1.43*255 + 0.144*255 = 401.37
G' =   0.426*R  0.43*G  0.144*B = 0.43*255 + 0.144*255 = 146.37
B' =   0.426*R  1.43*G -0.856*B = 1.43*255 - 0.856*255 = 146.37

Then a final color rgb(255,146.37,146.37) which is not a red one

html {
  background: rgb(255, 146.37, 146.37)
}

Temani Afif
  • 263.7k
  • 27
  • 345
  • 457