JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
<head>
    <title>Pure CSS3 Picture</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    
</body>
</html>

CSS

body{
    background-color: #0094D9;
    margin: 0px;

    /* Webkit */
   background-image:
      -webkit-gradient(radial, 50% 50%, 2, 50% 50%, 40, from(white), color-stop(0.1, rgba(248,255,128,.5)), to(transparent)),
      -webkit-gradient(radial, 50% 50%, 1, 50% 50%, 30, from(white), color-stop(0.1, rgba(255,186,170,.4)), to(transparent)),
      -webkit-gradient(radial, 50% 50%, 1, 50% 50%, 40, from(rgba(255,255,255,.9)), color-stop(0.05, rgba(251,255,186,.3)), to(transparent)),
      -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 30, from(rgba(255,255,255,.4)), color-stop(0.03, rgba(253,255,219,.2)), to(transparent));

      /* Background Attributes */
   background-size: 550px 550px, 350px 350px, 250px 270px, 220px 200px;
   background-position: 0 0, 30px 60px, 130px 270px, 70px 150px;
}