<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
<div class="four"></div>
.one {
  height: 100px;
  margin: 20px;
  background: radial-gradient(circle closest-side, #56ab2f, #a8e063);
}

.two {
  height: 100px;
  margin: 20px;
  background: radial-gradient(circle 80px, #56ab2f, #a8e063);
}

.three {
  height: 100px;
  margin: 20px;
  background: radial-gradient(circle, #56ab2f, #a8e063 150px);
}

.four {
  height: 100px;
  margin: 20px;
  background: radial-gradient(circle farthest-side, #56ab2f, #a8e063);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.