How to Apply Shadow Effect on Text Using CSS? Last Updated : 19 Nov, 2024 Comments Improve Suggest changes Like Article Like Report The CSS text-shadow property is used to add a shadow to the text.Adding a shadow to text using CSS text-shadowThe text-shadow property of CSS is used to apply the shadow effect on text. It takes four values verticalShadow, horizontalShadow, blur, and color.Syntaxtext-shadow: verticalShadow horizontalShadow blur color;Example 1: A shadow is added to the text using the text-shadow property. HTML <h1>Text without shadow</h1> <h1 style="text-shadow: 5px 5px rgb(82, 78, 78);">Text with Shadow</h1> Outputtext-shadowExample 2: A blur effects added to the text using the text-shadow property. HTML <h1>Text without Shadow</h1> <h1 style="text-shadow: 7px 7px 4px rgb(143, 135, 135);"> Text with shadow and blur effect </h1> Outputtext with blur and shadow Comment More infoAdvertise with us Next Article How to Apply Shadow Effect on Text Using CSS? M manikumarsingh789 Follow Improve Article Tags : Web Technologies CSS CSS-Properties CSS-Questions Similar Reads How to apply no shadow in an element using CSS ? In this article, we are going to learn How to apply no shadow in an element using CSS, To remove the box shadow from an element in CSS, you can use the box-shadow property with a value of none, like this: box-shadow: none, This will effectively remove any existing shadow or prevent a shadow from bei 1 min read How to Add Shadow to Text using CSS? The text-shadow property is used to add shadow to the text. The text-shadow property creates text shadows, specifying horizontal/vertical offsets, blur radius, and color for depth and emphasis.Note: We can customize text shadow by changing position, blur, and color for improved appearance and visual 1 min read How to Create Embossed Text Effect using CSS ? The embossed text effect creates a 3D illusion, making text appear raised or pressed into the page. Using CSS, this effect is achieved by applying contrasting text-shadow values that simulate light and shadow, giving the text a visually elevated or indented appearance.Approach:Basic HTML Structure: 2 min read How to create a drop shadow effect using CSS ? In this article, we are going to learn how to create a drop shadow effect using CSS. drop-shadow() is an inbuilt function used to create a blurred shadow in a given offset and color. A drop shadow effect adds depth and visual interest to elements on a web page by creating a shadow behind them. This 3 min read Apply Glowing Effect to the Image using HTML and CSS While surfing most of the websites you have seen some special effects which can be seen on various images while putting your cursor over them. So, in this article, we are going to implement the same. We can use such images as a card for our website. In this article, you’re going to learn how to app 2 min read Like