scale()
The scale() transform function resizes an element around its transform origin.
Syntax
scale(<x>, <y>?) | scaleX() | scaleY()Examples
.thumb {
transition: transform 0.2s;
}
.thumb:hover { transform: scale(1.05); }
Output
Smoothly enlarges the thumbnail to 105% on hover without reflowing surrounding content.
Notes
Values are unitless multipliers; 1 is unchanged, negative flips the element. A single argument scales both axes uniformly. Scaling does not affect layout, so neighbors do not move. Set transform-origin to change the anchor.
Browser & runtime support
| Environment | Since version |
|---|---|
| chrome | 36 |
| firefox | 16 |
| safari | 9.0 |
| edge | 12 |