.example{
  height: 400px;
  width: 100%;
  position: relative;
  counter-increment: Index;
}
.example:after{
  content:counter(Index);
  font-size:50px;
  color:#fff;
  position:absolute;
}
.box1{
  background-image: radial-gradient(center top, circle farthest-corner, #48B5DC 0%, #1765AD 100%);
}
.box2{
  background-image: radial-gradient(center top, circle farthest-corner, #DCB735 0%, #9A3A10 100%);
}
.box3{
  background-image: radial-gradient(center top, circle farthest-corner, #9CB825 0%, #3E600C 100%);
}
.box4{
  background-image: radial-gradient(center top, circle farthest-corner, #9E2417 0%, #3C0C08 100%);
}