How to Create Engraved Text Effect using HTML and CSS ?

The engraved text effect is an effect that you can use in your websites as a heading or a sub-heading to make it look more pleasing and attractive.

Approach: The engraved text effect can be easily generated using HTML and CSS. First we will create a basic text using HTML and then by using the CSS text-shadow property we will generate the desired effect.

In the above example, we first create a div tag that contains some text inside of it, then we design text using CSS basic properties. Then we will use the text-shadow property to generate the engraved effect.