Licorice

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Licorice</title>
    <style>
      #root {
        width: 500px;
        height: 500px;
        background:
          radial-gradient(circle at -238% 50%, rgb(42 53 54 / 0) 74%, rgb(42 53 54 / 1) 75%) 280px 50px / 13px 51px no-repeat repeat, /* Right mask */
          radial-gradient(circle at 306% 50%, rgb(42 53 54 / 0) 74%, rgb(42 53 54 / 1) 75%) 219px 32px / 13px 51px no-repeat repeat, /* Left mask */
          linear-gradient(19deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255 / 0.43) 43.29%, rgb(0 0 0 / 0.26) 50%, rgb(0 0 0 / 0) 67.74%, rgb(255 255 255 / 0.36) 100%) 221px 66px / 71px 51px no-repeat repeat, /* Shade */
          linear-gradient(rgb(42 53 54 / 1), rgb(42 53 54 / 1)) 292px 16px / 232px 100px no-repeat repeat, /* Right background */
          linear-gradient(rgb(42 53 54 / 1), rgb(42 53 54 / 1)) -11px 16px / 232px 100px no-repeat repeat, /* Left background */
          linear-gradient(0deg, rgb(69 255 144 / 1) 0%,  50%, rgb(69 168 255 / 1) 100%) 204px 0px / 100px 500px no-repeat; /* Gradient */
      }
    </style>
  </head>
  <body>
    <div id="root"></div>
  </body>
</html>
Colors

Views

Code size

Layers

Explore

Community

Social
