This post will take less than a minute to read.
CSS has a keyword value for use when defining colour called
transparent. Unfortunately that keyword is a little more complicated than it first might appear. Basically,
transparent is equal to
rgba(0,0,0,0). What could be wrong with that? The alpha channel is at zero opacity, isn’t that transparent?
Unfortunately it’s not that simple.
Another way to accurately describe it would be transparent black. Why does this matter? Well let’s say that you wanted to fade out the opacity of a light color, perhaps using a CSS gradient. Due to
transparent actually being black with zero opacity the light color won’t simply fade out, it will darken out (excuse my lack of a better term). As the gradient approaches
transparent it will also approach pure black.
A picture is a thousand words, and hopefully this test case is more illustrative again.
For more information have a look at this article: http://www.w3.org/TR/css3-color/#transparent