Which CSS property defines the transparency of an element?

The story behind the answer

The CSS property that defines an element’s transparency is opacity. It controls how much of the element’s pixels are visible and how much of the background shows through.

The property accepts values from 0 to 1, or from 0% to 100%. An opacity of 1 is fully opaque, 0.5 is semi-transparent, and 0 makes the element visually invisible. The default value is 1. Unlike an alpha value applied only to a background color, opacity affects the element as a whole, including its text, images, and child content.

Opacity is often confused with visibility and display. visibility can hide an element while preserving its layout space, whereas display can remove it from layout entirely. An element with opacity: 0 still exists in the document and may still receive focus or pointer events, so hiding interactive content may require additional accessibility and interaction handling.

Source: Wikipedia · fact-checked Aug. 2026

Add question to a list

Choose a list to keep this question in: