text color gradient css generator code example
Example 1: css gradient text
h1 {
font-size: 72px;
background: -webkit-linear-gradient(#eee, #333);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
Example 2: how to apply linear gradient to text in css
.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;
}
Example 3: gradient text color css
h4 {
background: linear-gradient(to right, #494964, #6f6f89);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
Example 4: css gradient generator
/*CSS Gradient Generator*/
https://cssgradient.io/
/*Example*/
.My-Class {
background: linear-gradient(to right, blue/*Color1*/, dodgerblue/*Color1*/);
}
Example 5: css gradient generator
background: linear-gradient(Direction (keyword or degrees), color1 10% (10% width), color2 width (it's not neccessary), ...);