CSS Text Shadow Opacity

Question

I have some text with the following css:

.text-description-header {
    font-size: 250%;
    color: white;
    text-shadow: 0 1px 0 black;
}

As you can see, it has a black shadow.

Question

Is it possible to make the shadow opaque?

Thanks

This question has been asked before - https://stackoverflow.com/questions/11549757/text-shadow-opacity — Sensoray, Jun 07 '17 at 12:28
Instead of black use `rgba(0, 0, 0, 0.5)` - the last number is the opacity. — Ori Drori, Jun 07 '17 at 12:28
i also recomment rgba color combination for better color effect ,especially for semi transparent colors — Bragadeeswaran, Jun 07 '17 at 12:36

score 1 · Answer 1 · answered Jun 07 '17 at 12:29

1

Use of rgba(0,0,0,0.2); or hsla(0,0%,0%,0.2)

 .text-description-header {
        font-size: 250%;
        color: white;
        text-shadow: 0 1px 0 rgba(0,0,0,0.2);
}

answered Jun 07 '17 at 12:29

Ehsan

Jones Joseph · Accepted Answer · 2017-06-07T12:35:34.967

1

Specify the color in RGBA (Red,Green,Blue,Alpha)

Where Alpha is the opacity (0 - 1)

Something like:

text-shadow: 0 1px 0 rgba(0,0,0,0.5);

For half transparent black shadow.

edited Jun 07 '17 at 12:35

answered Jun 07 '17 at 12:30

Jones Joseph

***Specify the color in RGBA (Red,Blue,Gree,Alpha)*** Need correction, Red Green Blue Alpha – Abhishek Pandey Jun 07 '17 at 12:33
Thanks @AbhishekPandey – Jones Joseph Jun 07 '17 at 12:36

2 Answers2