scale() CSS Function

Description

The scale() CSS function scales an element in two-dimensional space horizontally and vertically or simultaneously in two directions. Zooming can occur both up and down.

Syntax

transform: scale(<numberX> [, <numberY>]?); 
/* the question mark indicates the second value is optional */

Values

  • <numberX>The scale of the element horizontally.
  • <numberY>The scale of the item vertically. If no value is specified, it defaults to <numberX>.

Example

<img class="scale" src="images/nature.jpg" alt="Nature Image">
.scale {
transform: scale(2, 1);
}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
??????
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
??????