opacity

Sets the transparency level of an element. A value of 0 is fully transparent, while 1 is fully opaque.

.overlay {
  opacity: 0.5;
  /* element becomes 50% see-through */
}
Initial value
1
Inherited
No
Applies to
allElements
Animation type
byComputedValueType
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+
2+
12+
ESC