Adding a gradient to your text

CSS code used:

.gradienttext span{
background-color: #f3ec78;
background-image: linear-gradient(45deg, #D16BA5, #86A8E7,#5FFBF1);
background-size: 100%;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent;
-moz-text-fill-color: transparent;

Where . gradienttext is the class name you have given to your element and the hex colours in line 3 are the gradient colours you want to use.

Here's a copy of the page from our tutorial:

This is the site we use to get gradient examples from:

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.