GRADIENT
.ART
css
Sign In
<div id="root"></div>#root {
width: 700px;
height: 700px;
background:
radial-gradient(ellipse, rgb(107 96 255) 0%, 48.93%, transparent 56.61%) 505px -51px / 391px 327px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(107 96 255 / 0.48) 32.88%, transparent 56.61%) 344px -179px / 694px 593px no-repeat, /* Bubble (Purple Glow) */
radial-gradient(ellipse, rgb(170 97 255) 0%, 43.84%, transparent 56.61%) -109px 483px / 377px 371px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(170 97 255 / 0.39) 29.11%, transparent 70.89%) -274px 281px / 740px 737px no-repeat, /* Bubble (Purple Glow) */
radial-gradient(ellipse, rgb(170 97 255) 0%, 36.99%, transparent 56.61%) 397px 427px / 377px 371px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(170 97 255 / 0.53) 28.77%, transparent 73.29%) 226px 261px / 669px 679px no-repeat, /* Bubble (Purple Glow) */
radial-gradient(ellipse, rgb(13 234 227 / 0.37) 37.46%, transparent 66.14%) 456px 373px / 185px 221px no-repeat, /* Bubble (Blue) */
radial-gradient(ellipse, rgb(13 234 227 / 0.37) 27.4%, transparent 66.14%) 147px 100px / 213px 208px no-repeat, /* Bubble (Blue) */
radial-gradient(ellipse, rgb(13 234 227 / 0.25) 34.59%, transparent 70.55%) -7px -54px / 514px 513px no-repeat, /* Bubble (Blue Glow) */
radial-gradient(ellipse, rgb(107 96 255) 0%, 43.15%, transparent 56.61%) 130px -70px / 289px 290px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(107 96 255 / 0.5) 33.9%, transparent 67.47%) 20px -161px / 510px 486px no-repeat, /* Bubble (Purple Glow) */
radial-gradient(ellipse, rgb(107 96 255) 0%, 41.78%, transparent 58.22%) 169px 314px / 289px 290px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(107 96 255 / 0.36) 33.56%, transparent 71.58%) 32px 177px / 563px 555px no-repeat, /* Bubble (Purple Glow) */
linear-gradient(0deg, transparent 0%, 50%, rgb(93 48 145 / 0.97) 100%) 0 0 / 700px 700px no-repeat; /* Background */
} Comments (0)
<iframe
src="https://gra.dient.art/embed/qpobbwa537"
title="Orbs | GradientArt"
width="700"
height="700"
style="border: 0; max-width: 100%; aspect-ratio: 700 / 700; height: auto;"
loading="lazy"
></iframe>Layers (14)
Bubble (Purple)
radial
Bubble (Purple Glow)
radial
Bubble (Purple)
radial
Bubble (Purple Glow)
radial
Bubble (Purple)
radial
Bubble (Purple Glow)
radial
Bubble (Blue)
radial
Bubble (Blue)
radial
Bubble (Blue Glow)
radial
Bubble (Purple)
radial
Bubble (Purple Glow)
radial
Bubble (Purple)
radial
Bubble (Purple Glow)
radial
Background
linear
GRADIENT
.ART
css