HomeMenu
Jesus · Bible · HTML · CSS · JS · PHP · SVG · Applications

image-rendering

Description

The image-rendering property for CSS specifies a hint to the user-agent about what aspects of an image are most important to preserve when the image is scaled, to aid the user-agent in the choice of an appropriate scaling algorithm.

Syntax

CSS

image-rendering: value;

JS

object.style.imageRendering = "value";

Values

<'image-rendering'> = auto | smooth | high-quality | crisp-edges | pixelated
auto

The scaling algorithm is UA dependent.

smooth

The image should be scaled with an algorithm that maximizes the appearance of the image.

high-quality

Identical to smooth, but with a preference for higher-quality scaling.

crisp-edges

The image must be scaled with an algorithm that preserves contrast and edges in the image, and which does not smooth colors or introduce blur to the image in the process.

pixelated

The image must be scaled with the "nearest neighbor" or similar algorithm, to preserve a "pixelated" look as the image changes in size.

Initial

auto

Examples

1 · auto

2 · crisp-edges

3 · high-quality

4 · pixelated

5 · smooth

6 · JS