Style backgroundColor Property

Definition and Usage

backgroundColor Set or return the background color of the element.

See also:

HTML Styles:background property

CSS Tutorial:CSS Background

CSS Reference Manual:background-color property

Instance

Example 1

Set the background color of the document:

document.body.style.backgroundColor = "red";

Try it yourself

Example 2

Set the background color of the specific <div> element:

document.getElementById("myDiv").style.backgroundColor = "lightblue";

Try it yourself

Example 3

Return the background color of the specific <div> element:

alert(document.getElementById("myDiv").style.backgroundColor);

Try it yourself

Example 4

Return the background color of the document:

alert(document.body.style.backgroundColor);

Try it yourself

Syntax

Return the backgroundColor property:

object.style.backgroundColor

Set the backgroundColor property:

object.style.backgroundColor = "color|transparent|initial|inherit"

Property value

Value Description
color

Specifies the background color.

Please see CSS color values, for a complete list of possible color values.
transparent Default. The background color is transparent (the underlying content is visible).
initial Set this property to its default value. See initial.
inherit Inherit this property from its parent element. See inherit.

Technical details

Default value: transparent
Return value: A string representing the background color.
CSS version: CSS1

Browser support

backgroundColor It is a CSS1 (1996) feature.

All browsers fully support it:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Support Support Support Support Support Support