Linear gradient

Gradient image css

#show_bg_2 {
 
background-image:
  /*two color gradient over an 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;
}

Css horizontal linear gradient

background: linear-gradient(to left, red, blue);

Css linear gradient

#grad {
  background-image: linear-gradient(to right, #f1b1b1 , #82e6e8);

}

How to make a linear gradient in css

/* Add the class name insted of class */
.class {
  background: linear-gradient(to top, #000000, #fffffff);
}

Html css background linear-gradient

#background {
  background-image: linear-gradient(to left, #4B2C4C , #151F28);
}

Linear gradient

background: linear-gradient(direction, colour-stop1, colour-stop2, ...);

Source: freecodecamp.org

Similar codes

21 votes104 views2 answers
Form field focus border remove css
CSS
38 votes144 views6 answers
Media query min and max width for all devices
CSS
13 votes135 views7 answers
Animate.css
CSS
1 vote114 views1 answer
Class indicator css
CSS
62 votes109 views3 answers
Css root variables
CSS
0 vote166 views1 answer
Bootstrap-navbar-container-fluid
CSS Bootstrap
9 votes136 views1 answer
Vevo playlist
CSS
1 vote127 views1 answer
Css select with attribute
CSS
12 votes199 views2 answers
How to center element in bulma
CSS Bulma
0 vote115 views1 answer
How to make bootstrap cards same height css trics
CSS