Window screen.colorDepth property

Definition and usage

colorDepth Property returns the color depth of the screen.

colorDepth Property returns the depth of bits per pixel.

colorDepth The property is read-only.

Example

Example 1

Get the palette bit depth:

let depth = screen.colorDepth;

Try it yourself

Example 2

Display alternative background color for 8-bit screens (to avoid ugly alternative colors for 8-bit screens that do not support modern colors):

if (screen.colorDepth <= 8)
  //Simple blue background color for 8-bit screens
  document.body.style.background = "#0000FF"
else
  //Vibrant blue background color for modern screens
  document.body.style.background = "#87CEFA"

Try it yourself

Example 3

All screen properties:

let text = "Total width/height: " + screen.width + "*" + screen.height + "<br>"
"Available width/height: " + screen.availWidth + "*" + screen.availHeight + "<br>"
"Color depth: " + screen.colorDepth + "<br>"
"Color resolution: " + screen.pixelDepth;

Try it yourself

Syntax

screen.colorDepth

Return value

Type Description
Number

Screen palette depth (in bits per pixel):

1, 4, 8, 15, 16, 24, 32, or 48.

Browser support

All browsers support screen.colorDepth:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Supports Supports Supports Supports Supports Supports

Related pages

screen.availHeight attribute

screen.availWidth attribute

screen.height Property

screen.width Property