Search code examples
opacitycss

Text shadow opacity


Is it possible to adjust the opacity of just the text shadow, rather than the text itself as well?

E.g I have purple text with a blue shadow. I'd like to make the blue shadow have an opacity without losing anything on the purple.

h1.blue {text-shadow: 3px 3px 0px #3f6ba9;}

Solution

  • Yes, but specify color in rgba mode to add alpha transparency.

    h1.blue {text-shadow: 3px 3px 0px rgba(63,107,169, 0.5)} //half of transparency