CSS scale3d() Function (original) (raw)

Last Updated : 30 Aug, 2024

The **scale3d() function is an inbuilt function which is used to resize the element in a 3D space. It scales the elements in the x, y, and z planes. **Syntax:

scale3d( sx, sy, sz )

**Parameters: This function accepts three parameters as mentioned above and described below:

Below examples illustrate the scale3d() function in CSS:

**Example 1:

html `

CSS scale3d() function 
<style>
    body {
        text-align: center;
    }
    
    h1 {
        color: green;
    }
    
    .scale3d_image {
        transform: scale3d(2, 1, 1);
    }
</style>

GeeksforGeeks

CSS scale3d() function

<br><br>

<img class="scale3d_image" src=

"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png" alt="GeeksforGeeks logo">

`

**Output: **Example 2:

html `

CSS scale3d() function 
<style>
    body {
        text-align: center;
    }
    
    h1 {
        color: green;
    }
    
    .GFG {
        font-size: 35px;
        font-weight: bold;
        color: green;
        transform: scale3d(1, 2, 1);
    }
</style>

GeeksforGeeks

CSS scale3d() function

<div class="GFG">Welcome to GeeksforGeeks</div>

`

**Output:

**Supported Browsers: The browsers supported by **scale3d() function are listed below:

Similar Reads