CSS scale() Function

.example {
  transform: scale(0.5);
}

Meaning

The scale() css function defines a transformation that resizes an element on the 2D plane.

Because the amount of scaling is defined by a vector, it can resize the horizontal and vertical dimensions at different scales.

This scaling transformation is characterized by a two-dimensional vector. Its coordinates define how much scaling is done in each direction.

Note: The scale() function only scales in 2D. To scale in 3D, use scale3d() instead.

Version: CSS3

scale(sx)

scale(sx, sy)

The scale() function is specified with either one or two values, which represent the amount of scaling to be applied in each direction.

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

The following table describes the arguments of this function.

Argument	Description
sx	Specifies a number or percentage representing the abscissa of the scaling vector.
sy	Specifies a number or percentage representing the ordinate of the scaling vector. If not defined, its default value is sx, resulting in a uniform scaling that preserves the element's aspect ratio.