<div id="watermelons"></div>


<div id="browser-support">
<strong>Demo for:</strong> CSS gradient
</div>

#watermelons {
  height: 150px;
  width: 300px;
  background: radial-gradient(circle at 25px 9px, black 2px, transparent 2px), radial-gradient(circle at 49px 28px, black 2px, transparent 2px), radial-gradient(circle at 38px 1px, black 2px, transparent 2px), radial-gradient(circle at 20px 4px, black 2px, transparent 2px), radial-gradient(circle at 80px 4px, black 2px, transparent 2px), radial-gradient(circle at 50px 10px, black 2px, transparent 2px), radial-gradient(circle at 60px 16px, black 2px, transparent 2px), radial-gradient(circle at 70px 16px, black 2px, transparent 2px), radial-gradient(ellipse at 50px 0, #E01F4E 34px, transparent 35px, #738202 44px, transparent 45px);
  background-size: 100px 50px;
}

#browser-support {
  background: ivory;
  border-left: 6px skyblue solid;
  font-family: courier new;
  font-size: 14px;
  margin: 12px 0;
  padding: 6px;
}