GRADIENT
.ART
css
Sign In
<div id="root"></div>#root {
width: 500px;
height: 500px;
background:
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 53px 217px / 80px 80px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 104px 231px / 50px 50px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 112px 256px / 70px 70px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 27px 235px / 70px 70px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 4px 259px / 70px 70px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 63px 247px / 90px 90px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 23px 247px / 90px 90px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 307px 333px / 80px 80px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 331px 336px / 127px 80px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 348px 321px / 60px 60px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 383px 314px / 60px 60px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 420px 350px / 60px 60px no-repeat, /* Cloud (copy) */
radial-gradient(ellipse, rgb(255 255 255) 0%, 60.8%, transparent 61%) 409px 327px / 60px 60px no-repeat, /* Cloud */
linear-gradient(90deg, transparent 30%, rgb(154 74 228) 30%, 34%, rgb(27 149 236) 34%, 38%, rgb(44 182 254) 38%, 42%, rgb(0 214 2) 42%, 46%, rgb(252 247 6) 46%, 50%, rgb(253 178 3) 50%, 54%, rgb(247 36 1) 54%, 58%, transparent 58%) 250px 252px / 333px 124px no-repeat, /* Rainbow (linear) */
radial-gradient(circle at 50% 100%, transparent 30%, rgb(154 74 228) 30%, 34%, rgb(27 149 236) 34%, 38%, rgb(44 182 254) 38%, 42%, rgb(0 214 2) 42%, 46%, rgb(252 247 6) 46%, 50%, rgb(253 178 3) 50%, 54%, rgb(247 36 1) 54%, 58%, transparent 58%) 50px -14px / 400px 267px no-repeat, /* Rainbow */
linear-gradient(rgb(128 222 234), rgb(128 222 234)) 0 0 / 500px 500px no-repeat; /* Background */
} Comments (0)
<iframe
src="https://gra.dient.art/embed/lzb2imzcyl"
title="Rainbow & Clouds | GradientArt"
width="500"
height="500"
style="border: 0; max-width: 100%; aspect-ratio: 500 / 500; height: auto;"
loading="lazy"
></iframe>Layers (16)
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
GRADIENT
.ART
css