Color Rotation, hue-rotate

Another interesting color filter is the hue-rotate color rotation. If we represent all of the colors as a wheel, then we can use this filter to rotate the image color along the wheel by a certain angle.

Thus, you can rotate colors using hue-rotate. The value is set in degrees, from 0deg to 360deg. You are also allowed to use a negative angle. A positive value will rotate the color clockwise, while a negative angle will rotate it counterclockwise. If the filter value is 0deg, then the element is displayed unchanged.

Examples:

.effect {
  filter: hue-rotate(90deg); /* Rotate clockwise by 90 degrees */
  filter: hue-rotate(-90deg); /* Rotate counterclockwise by 90 degrees */
}