Quick Tip: How to Add Gradient Effects and Patterns to Text - SitePoint

To create the effect we're after, we first set the color of the element to transparent. In the code below, we're styling an <h1> heading.

Let's first try setting a gradient effect on our heading text: Here, we've set a left-to-right gradient that will span the heading text.

Read at Sitepoint