background color gradient in css code example
Example 1: gradient image css
#show_bg_2 {
background-image:
linear-gradient(to bottom, rgba(245, 246, 252, 0.52),
rgba(117, 19, 93, 0.73)),url('images/background.jpg');
width: 80%;
height: 400px;
background-size: cover;
}
Example 2: css gradient
.yourElementClass{
background: linear-gradient(to top, #fff000 0%, #000fff 100%);
}
Example 3: gradient css background
background: rgb(166,166,166);
background: linear-gradient(0deg, rgba(166,166,166,1) 0%, rgba(255,255,255,1) 29%);
Example 4: linear gradient in CSS
The general syntax of linear-gradient is-
background: linear-gradient(gradient direction, color1 , color2 , color3, .....);
Forexample-
background: linear-gradient(46deg,green,blue,yellow,pink);
NOTE: (common mistake) we forget to write the semi-colon (;)
Example 5: css gradient
background: linear-gradient(Direction (keyword or degrees), color1 10% (10% width), color2 width (it's not neccessary), ...);