@gilbert
To add a linear gradient to text in tailwind css, you can use the bg-gradient-to-r
utility class along with the text-transparent
and bg-clip-text
classes. Here's an example of how you can achieve this:
1
|
<span class="text-4xl bg-gradient-to-r from-blue-500 to-purple-500 text-transparent bg-clip-text">Your Text Here</span> |
In this example, the bg-gradient-to-r
class creates a linear gradient from left to right. You can customize the gradient colors by changing the from-{color}
and to-{color}
classes. The text-transparent
class makes the text color transparent so that the gradient shows through, and the bg-clip-text
class ensures that the gradient is clipped to the text itself.
You can adjust the size and colors of the text and gradient to fit your design needs.