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%) 64px 44px / 185px 221px no-repeat, /* Bubble (Purple) */
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(170 97 255) 0%, 48.93%, transparent 56.61%) -109px 483px / 377px 371px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(170 97 255) 0%, 48.93%, transparent 56.61%) 397px 427px / 377px 371px no-repeat, /* Bubble (Purple) */
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) 37.46%, transparent 66.14%) 147px 100px / 213px 208px no-repeat, /* Bubble (Blue) */
radial-gradient(ellipse, rgb(107 96 255) 0%, 48.93%, transparent 56.61%) 130px -70px / 289px 290px no-repeat, /* Bubble (Purple) */
radial-gradient(ellipse, rgb(107 96 255) 0%, 48.93%, transparent 56.61%) 169px 314px / 289px 290px no-repeat, /* Bubble (Purple) */
linear-gradient(0deg, rgb(107 96 255) 0%, 50%, rgb(170 97 255) 100%) 0 0 / 700px 700px no-repeat; /* Background */
} Comments (0)
<iframe
src="https://gra.dient.art/embed/l68uvddknv"
title="Orbs | GradientArt"
width="700"
height="700"
style="border: 0; max-width: 100%; aspect-ratio: 700 / 700; height: auto;"
loading="lazy"
></iframe>Layers (9)
Bubble (Purple)
radial
Bubble (Purple)
radial
Bubble (Purple)
radial
Bubble (Purple)
radial
Bubble (Blue)
radial
Bubble (Blue)
radial
Bubble (Purple)
radial
Bubble (Purple)
radial
Background
linear
GRADIENT
.ART
css