How to add Text shadows in SwiftUI

In this tutorial, we will see how to add Text shadows in SwiftUI.

We can simply add a shadow effect to a text by using the shadow() modifier. It takes parameters such as color, radius, x, and y offset to customize the shadow’s appearance.

When we apply this modifier to the Text view with the required parameter value, it will add a shadow behind that text view.

Syntax:

.shadow(color: .gray, radius: 2, x: 5, y: 5)

In the above code, the shadow() modifier takes 4 parameters those are:

• color: Here we can specify the color of the shadow.
• radius: We can adjust here the blurriness of the shadow. A larger radius value creates a more blurry shadow.
• x: Controls the horizontal position of the shadow relative to the view.
• y: Controls the vertical position of the shadow relative to the view.

Now have a look at the example below to add a shadow effect to a text.

Example

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("CodeSpeedy is helpful for SwiftUI")
            .font(.title) // To change the font size
        
            .shadow(color: .gray, radius: 2, x: 5, y: 5) // To add shadow effect
    }
}

In the above code, I have specified the shadow color to gray, the radius to 2, and the horizontal (x) and vertical (y) offset to 5.

Output: