How to Split a Background Into 2 Colors with CSS

<h1>YOUR CONTENT GOES HERE!</h1>
*{
padding: 0;
margin: 0;
}
body{
width: 100%;
min-height: 100vh;
background: linear-gradient(
to right,
pink 0%,
pink 50%,
paleturquoise 50%,
paleturquoise 100%
);
display: flex;
justify-content: center;
align-items: center;
}
<div class="container">
<h1>YOUR CONTENT GOES HERE!</h1>
</div>
.container{
width: 600px
min-height: 400px;
background: linear-gradient(
to right,
pink 0%,
pink 50%,
paleturquoise 50%,
paleturquoise 100%
);
display: flex;
justify-content: center;
align-items: center;
}

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store