The transparent
keyword represents a fully transparent color. This makes the background behind the colored item completely visible. Technically, transparent
is a shortcut for rgb(0 0 0 / 0%)
.
To prevent unexpected behavior, such as in a <gradient>
, the current CSS spec states that transparent
should be calculated in the alpha-premultiplied color space. However, be aware that older browsers may treat it as black with an alpha value of 0
.
The transparent
keyword wasn't a true color in CSS Level 2 (Revision 1). It was a special keyword that could be used instead of a regular <color>
value on two CSS properties: background
and border
. It was essentially added to allow developers to override an inherited solid color. With the advent of alpha channels in CSS Colors Level 3, transparent
was redefined as a true color. It can now be used wherever a <color>
value can be used.