I've been using the following CSS rule…
.inset-shadow {
color: Transparent;
background: #8C2633;
text-shadow: rgba(255, 255, 255, 0.4) 2px 2px 2px, 0 0 0 rgba(0, 0, 0, 0.5);
}
… to produce the following result:
The following is another example of this text effect…
…which can be found in the following exercise on CodePen
The problem is that the behavior of this construct is inconsistent. Specifically, the Microsoft browsers are having difficulty displaying the text when I use the "transparent" value for the CSS color property. Subsequent research woul