CSS grayscale() Function

❮ Previous Functions Next ❯


img {
  filter: grayscale(1.5);



The grayscale() css function converts the image to grayscale.

Note: Negative values are not allowed.

Version: CSS3

Standard Syntax


Browser Support

The numbers in the table specify the first browser version that fully supports the property.


Function Arguments

The following table describes the arguments of this function.

Argument Description
value Specified as a number or a percentage.


  • A value of 100% is completely grayscale, while a value of 0% leaves the input unchanged.
  • Values between 0% and 100% are linear multipliers on the effect.

Default value when omitted is 1.

The initial value for interpolation is 0.

See also

The other <filter-function> functions available to be used in values of the filter and backdrop-filter properties include:

❮ Previous Functions Next ❯