How create two different colour background?

Answer 1

Use a css gradient: https://css-tricks.com/css3-gradients/

background: linear-gradient(blue, yellow);

Or if you want don't want the gradual fade you have to set the position:

background: linear-gradient(to right, blue 0%, blue 50%, yellow 50%, yellow 100%);

Answer 2

Hi Devansh Mishra

You can use clip-path to make different shapes on background. You can use gradient effects. Check this out, it might help you

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds

https://code.sololearn.com/WhML78kGmg8U/?ref=app

Answer 3

#try this hope it'll work fine

body{
background: linear-gradient(90deg,red,blue);
}

Answer 4

Hi, you can use gradients for this

Answer 5

https://cssgradient.io/ this is good tool to make your gradiant look good, you can easy play with values

Answer 6

The background-color property doesn't let you put two or more background colors on a single element. But, you can achieve this using the background-image property.
For example, if you want to set red and yellow color backgrounds, you can do something like this:
div{
background-image: linear-gradient(red, yellow);
height: 200px;
}
This will put a gradient of red and yellow color on the div element.
You can find the detailed explanation here......
https://programmersportal.com/css-background-image-property/

Answer 7

Deva;nsh Mishra
Background:green,red background-blend-mode:multiply;