CSS image-rendering Property

The image-rendering property specifies the algorithm used for image scaling. When the user scales the image above or below the original dimensions, this property can be used to modify the scaling behavior.




Property Values

Value Description
auto Allow the browser to select the scaling algorithm. This is the default setting.
smooth Use an algorithm to smooth out the image's colours.
high-quality The same as smooth, but with an emphasis on higher-quality scaling.
crisp-edges Use an algorithm that preserves the image's contrast and edges.
pixelated When the image is scaled up, the nearest-neighbour algorithm is used, and the image appears to be made up of large pixels. When the image is scaled down, it has the same effect as auto.
initial This property is set to its default value.
inherit This property is inherited from its parent element.

Supported Browsers

Property Chrome Firefox Safari Edge / IE Opera
image-rendering 41.0 65.0 10.0 79.0 28.0