CSS: Opacity (Transparency)

Opacity property

The Opacity property is to specify degree of transparency in a element. For the whole element.

if you just want opacity in color, use

• CSS: rgb()
• CSS: HSL Color
• color name transparent

Opacity Syntax

Value is 0 to 1. The higher the opacity value, the more opaque.

div {
 /* Decimal number syntax */
 opacity: 0.9;

 /* Percent syntax */
 opacity: 90%;
}

Example

Here is text on top of a image. The text's background has increasingly higher opacity.

Browser Support

Supported in all browsers as of 2012-04-20.