JavaScript Document bgColor Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word BGCOLOR

Definition

document.bgColor gets or sets the background color of the current document (MDN). It is a legacy HTML-era API — useful when reading old scripts, not for new work.

Read the notes below before you get or set this property. Prefer feature detection when support is limited.

Syntax

Use document.bgColor. Start with this line.

JavaScript
document.bgColor / document.bgColor = color
CallWhat it does
document.bgColor / document.bgColor = colorPrimary signature.

Built into the browser. Read or assign document.bgColor — no import required.

Library declarations
JavaScript
document.bgColor / document.bgColor = color

Parameters

ParameterDescription
Color stringOptional. Name or hex (MDN)
Writable?Required. Getter and setter (legacy)

Return Value

Return ValueDescription
*The current value of document.bgColor.

JavaScript Examples

Example 1 — Named Color (MDN)

MDN’s classic assignment: set the document background to "darkblue".

JavaScript
document.bgColor = "darkblue";
console.log(document.bgColor);
Try It Yourself

How It Works

  1. Assign a color name — MDN allows words like "darkblue".
  2. The browser paints the document background with that color.
  3. Read it back with document.bgColor to confirm.
  4. Remember: this API is deprecated; demos only.

Example 2 — Hex Color

Hex strings work the same way as named colors (MDN).

JavaScript
document.bgColor = "#e8f4ff";
console.log(document.bgColor);

document.bgColor = null;
console.log(document.bgColor); // ""
Try It Yourself

How It Works

  1. Pass a hex string such as "#e8f4ff".
  2. Log the property — browsers may keep or normalize the string.
  3. Assign null — MDN: it becomes "".
  4. Use light colors in demos so text stays readable.

Example 3 — Modern CSS Replacement (MDN)

Prefer background-color on the body (or a stylesheet) instead of bgColor.

JavaScript
// Avoid: document.bgColor = "lightyellow";

// Prefer (MDN):
document.body.style.backgroundColor = "lightyellow";
console.log(document.body.style.backgroundColor);
Try It Yourself

How It Works

  1. Skip bgColor in new projects (deprecated).
  2. Set CSS via the DOM with document.body.style.backgroundColor.
  3. Or use a stylesheet — body { background-color: … }.
  4. Read computed styles with getComputedStyle when you need the final color.
Compatibility

Browser Support

Document.bgColor is a legacy HTML document color property. MDN marks it Deprecated. Many browsers still expose it for compatibility, but new code should use CSS background-color.

✓ Deprecated · Legacy

Document.bgColor

Gets or sets the document background color. Prefer CSS. Still present in many engines for old pages.

Legacy Deprecated
Google Chrome Legacy support
Yes*
Microsoft Edge Legacy support
Yes*
Mozilla Firefox Legacy (default white)
Yes*
Apple Safari Legacy support
Yes*
Opera Legacy support
Yes*
Internet Explorer Legacy support
Yes*
bgColor Legacy

Bottom line: Supported widely for compatibility, but deprecated. See the MDN bgColor reference.

Frequently Asked Questions

MDN: it gets or sets the background color of the current document.
Yes. MDN marks Document.bgColor as Deprecated. Prefer CSS background-color (for example on body) in new code.
A string color name (such as darkblue) or a hexadecimal value (such as #ff0000). Setting null is converted to the empty string (MDN).
MDN notes the default bgColor in Firefox is white (#ffffff).
Use CSS background-color. Through the DOM: document.body.style.backgroundColor, or a stylesheet rule such as body { background-color: ... } (MDN).
No. Learn it to read or migrate legacy scripts. Style page backgrounds with CSS instead.

Next: body

Continue with the Document body property — where modern background styles belong.

body →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

9 people found this page helpful

JavaScript Document applets Property JavaScript Document body Property