Skip to content
Related Articles

Related Articles

Improve Article

CSS | perspective() Function

  • Last Updated : 04 Feb, 2021

The perspective() function is an inbuilt function in CSS which is used with transform property to set the perspective effect on images.


perspective( length );

Parameters: This function accepts single parameter length which is used to hold the value of perspective level. The length value represents the distance from user to z=0 plane. It is a mandatory parameter.

Return value: It makes the image perspective on the basis of user define value.

Below example illustrates the perspective() function in CSS:



<!DOCTYPE html>
        CSS | perspective() function
        h1 {
            color: green;
        .left {
            transform: perspective(400px) rotateY(70deg);
        <h4>CSS | perspective() function</h4>
            <img class="left" src=
                alt="Sample image">
            <img class="right" src=
                alt="Sample image">


CSS perspective() function

Supported browser: The browser supported by CSS | perspective() function are listed below: 

  • Google Chrome
  • Internet Explorer/ Microsoft Edge
  • Mozilla Firefox
  • Safari
  • Opera


My Personal Notes arrow_drop_up
Recommended Articles
Page :