background

The ultimate shorthand for setting all background properties (color, image, repeat, etc.) in a single line. It's the most common way to style backgrounds efficiently.

Quick example

.hero {
  /* image | repeat | position / size | color */
  background: url('hero-bg.jpg') no-repeat center / cover #333;
}

Quick facts

Initial value
See individual properties
Inherited
No
Applies to
all elements

background Browser Support

Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

Safe to use without fallbacks.

1+
1+
1+
12+
ESC