Rainbow & Clouds

Designed by
Yoav Kadosh

Keywords:

Colors:

Layers
16
Views
102
Open in Editor

Layers

Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud (copy)
(radial)
Cloud
(radial)
Rainbow (linear)
(linear)
Rainbow
(radial)
Background
(linear)

CSS

width: 500px;
height: 500px;
background:
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 53px 217px / 80px 80px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 104px 231px / 50px 50px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 112px 256px / 70px 70px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 27px 235px / 70px 70px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 4px 259px / 70px 70px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 63px 247px / 90px 90px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 23px 247px / 90px 90px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 307px 333px / 80px 80px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 331px 336px / 127px 80px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 348px 321px / 60px 60px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 383px 314px / 60px 60px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 420px 350px / 60px 60px no-repeat no-repeat, /* Cloud (copy) */
radial-gradient(ellipse at 50% 50%, rgba(255,255,255,1) 0%, 60.8%, rgba(255,255,255,0) 61%) 409px 327px / 60px 60px no-repeat no-repeat, /* Cloud */
linear-gradient(90deg, rgba(154,74,228,0) 30%, rgba(154,74,228,1) 30%, 34%, rgba(27,149,236,1) 34%, 38%, rgba(44,182,254,1) 38%, 42%, rgba(0,214,2,1) 42%, 46%, rgba(252,247,6,1) 46%, 50%, rgba(253,178,3,1) 50%, 54%, rgba(247,36,1,1) 54%, 58%, rgba(247,36,1,0) 58%) 250px 252px / 333px 124px no-repeat no-repeat, /* Rainbow (linear) */
radial-gradient(circle at 50% 100%, rgba(154,74,228,0) 30%, rgba(154,74,228,1) 30%, 34%, rgba(27,149,236,1) 34%, 38%, rgba(44,182,254,1) 38%, 42%, rgba(0,214,2,1) 42%, 46%, rgba(252,247,6,1) 46%, 50%, rgba(253,178,3,1) 50%, 54%, rgba(247,36,1,1) 54%, 58%, rgba(247,36,1,0) 58%) 50px -14px / 400px 267px no-repeat no-repeat, /* Rainbow */
linear-gradient(0deg, rgba(128,222,234,1) 0%, rgba(128,222,234,1) 100%) 0px 0px / 500px 500px no-repeat no-repeat; /* Background */