HTML DOM Screen pixelDepth Property

Last Updated : 14 Jun, 2023

The Screen pixelDepth property is used for returning the color resolution of the visitor’s screen. It returns the color resolution in bits per pixel. It is an alias to the colorDepth property.

The possible returned by pixelDepth Property are:

1 bit per pixel
4 bits per pixel
8 bits per pixel
15 bits per pixel
16 bits per pixel
24 bits per pixel
32 bits per pixel
48 bits per pixel

Syntax:

screen.pixelDepth

Return Value: A Number, representing the color resolution, in bits per pixel.

Below program illustrates the Screen pixelDepth Property :

Checking the pixel depth of a user’s screen.

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <title> 
      Screen pixelDepth Property in HTML 
    </title> 
    <style> 
        h1 { 
            color: green; 
        } 
          
        h2 { 
            font-family: Impact; 
        } 
          
        body { 
            text-align: center; 
        } 
    </style> 
</head> 
  
<body> 
  
    <h1>GeeksforGeeks</h1> 
    <h2>Screen pixelDepth Property</h2> 
      
<p> 
      For checking the screen's pixel depth, 
      double click the "Check Pixel Depth" button:  
    </p> 
  
    <button ondblclick="pixel_depth()"> 
      Check Pixel Depth 
    </button> 
  
    <p id="pd"></p> 
  
    <script> 
        function pixel_depth() { 
            var r = "Pixel depth in bits per pixel : " 
                                + screen.pixelDepth; 
            document.getElementById("pd").innerHTML = r; 
        } 
    </script> 
</body> 
</html> 