THE WORLD'S LARGEST WEB DEVELOPER SITE
HTML CSS JAVASCRIPT SQL PHP BOOTSTRAP HOW TO JQUERY W3.CSS ANGULARJS XML MORE FORUM EXAMPLES REFERENCES

Screen colorDepth Property

❮ Screen Object

Example

Get the bit depth of the color palette:

var x = "Color Depth: " + screen.colorDepth;
Try it Yourself »

More "Try it Yourself" examples below.

Definition and Usage

The colorDepth property returns the bit depth of the color palette for displaying images (in bits per pixel).

Browser Support

Property
colorDepth Yes Yes Yes Yes Yes

Syntax

screen.colorDepth

Technical Details

Return Value: A Number, representing the bit depth of the color palette for displaying images, in bits per pixel.

Possible values:
  • 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

More Examples

Example

Display an alternate background color for 8 bit screens (to avoid that 8 bit screens, which do not support the modern color, uses an ugly substitute color instead):

if (screen.colorDepth <= 8)
  //simple blue background color for 8 bit screens
  document.body.style.background = "#0000FF"
else
  //fancy blue background color for modern screens
  document.body.style.background = "#87CEFA"
Try it Yourself »

Example

All screen properties in one example:

var txt = "";
txt += "<p>Total width/height: " + screen.width + "*" + screen.height + "</p>";
txt += "<p>Available width/height: " + screen.availWidth + "*" + screen.availHeight + "</p>";
txt += "<p>Color depth: " + screen.colorDepth + "</p>";
txt += "<p>Color resolution: " + screen.pixelDepth + "</p>";
Try it Yourself »
❮ Screen Object