Text Gradient

.gradient-text {
  background-color: #f3ec78;
  background-image: linear-gradient(45deg, #f3ec78, #af4261);
  background-size: 100%;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
}

To get more gradients quickly, goto uigradients.com and select from a list of gradients. Copy paste in the .gradient-text field.

Live Demo Source Code