<div class="holder">
  <p class="heading">This is the best workspace ever</p>
  <p class="tagline">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p>
</div>
body{
  margin:0;
  padding:0;
  font-family: 'Poppins', sans-serif;
}
.holder{
  position:relative;
  width:100%;
  display:flex;
  height:70vh;
  justify-content:center;
  align-items:center;
  flex-direction:column;
  overflow:hidden;
}
.holder:before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:100%;
  background: #ec008c;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #fc6767, #ec008c); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  border-radius:0 0 50% 50%/0 0 100% 100%;
  transform:scaleX(1.5);
}
.heading{
  font-size:40px;
  font-weight:500;
  margin:5px;
  z-index:1;
  width:100%;
  color:#f5f6fa;
  text-align:center;
}
.tagline{
  z-index:1;
  font-size: 15px;
  font-weight: 200;
  width: 100%;
  color:#f5f6fa;
  text-align:center;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.