GRADIENT
.ART
css
Sign In
<div id="root"></div>#root {
width: 500px;
height: 500px;
background:
radial-gradient(ellipse, transparent 0%, 50%, rgb(42 100 151) 50%, 52.94%, rgb(13 42 66) 100%) 0 0 / 500px 500px no-repeat, /* Mask */
radial-gradient(ellipse at 100% 100%, rgb(0 0 0 / 0.41) 0%, 24.72%, transparent 65.2%) 80px 79px / 355px 355px no-repeat, /* Shade */
radial-gradient(ellipse at 100% 100%, rgb(0 0 0 / 0.3) 0%, 50%, transparent 71.29%) 142px 148px / 291px 289px no-repeat, /* Shade */
radial-gradient(ellipse, rgb(255 255 255 / 0.28) 0%, 14.69%, transparent 68.07%) 98px 96px / 158px 162px no-repeat, /* Shine */
radial-gradient(ellipse, transparent 0%, 65.56%, rgb(255 255 255 / 0.49) 68.07%) 65px 68px / 374px 371px no-repeat, /* Shine */
radial-gradient(ellipse at 0 100%, rgb(0 224 90) 0%, 50%, transparent 54.81%) 71px 259px / 104px 140px no-repeat, /* Land */
radial-gradient(ellipse, rgb(0 224 90) 0%, 50%, transparent 54.81%) 228px 94px / 233px 88px no-repeat, /* Land */
radial-gradient(ellipse, rgb(0 224 90) 0%, 50%, transparent 54.81%) 168px 72px / 233px 88px no-repeat, /* Land */
radial-gradient(ellipse at 100% 0, rgb(0 224 90) 0%, 50%, transparent 54.81%) 101px 258px / 117px 71px no-repeat, /* Land */
radial-gradient(ellipse at 0 0, rgb(0 224 90) 0%, 50%, transparent 54.81%) 249px 258px / 117px 170px no-repeat, /* Land */
radial-gradient(ellipse at 100% 0, rgb(0 224 90) 0%, 50%, transparent 54.81%) 172px 258px / 77px 170px no-repeat, /* Land */
radial-gradient(ellipse at 100% 100%, rgb(0 224 90) 0%, 50%, transparent 54.81%) 101px 173px / 117px 85px no-repeat, /* Land */
radial-gradient(ellipse at 0 100%, rgb(0 224 90) 0%, 50%, transparent 54.81%) 218px 173px / 160px 85px no-repeat, /* Land */
radial-gradient(ellipse, rgb(69 117 255) 0%, 50%, rgb(42 100 151) 100%) 69px 67px / 361px 364px no-repeat; /* Water */
} Comments (0)
Colors
Views
12,302
Code size
2.26 KB
Layers
14
<iframe
src="https://gra.dient.art/embed/mq54ntrzsr"
title="Earth 🌍 | GradientArt"
width="500"
height="500"
style="border: 0; max-width: 100%; aspect-ratio: 500 / 500; height: auto;"
loading="lazy"
></iframe>Layers (14)
Mask
radial
Shade
radial
Shade
radial
Shine
radial
Shine
radial
Land
radial
Land
radial
Land
radial
Land
radial
Land
radial
Land
radial
Land
radial
Land
radial
Water
radial
GRADIENT
.ART
css