iOS Dev

How to Add Gradient on Text in SwiftUI

Learn to create a gradient text in SwiftUI

Created by the author

For my recent iOS app development, I need a gradient text. And let me show you how to create a gradient text.

Screenshot captured by the author

Complete Code

Complete Code to create Gradient Text in SwifUI

Step 1

I have created a Color extension from the following source. So by calling the extension method, I can pass a hex string to create color.

Step 2

Now let’s define a GradientText view. Inside, define a colors constant of Gradient object. Then using RadialGradent view create a RadialGradent view and masks it by passing a Text view object.

Step 3

Now inside in your main view, create a GradientTextview and pass the string.

GradientText(title: "Good Morning")
                .padding()

That’s it.