Citrus Splash Gradient
Yellow, orange, and lime mesh blobs bursting from their own sunny base.
Open in the gradient generator →
Color Stops
#FFEE58
#FF7043
#9CCC65
#FFCA28
Background · #FFEE58
Citrus Splash CSS Code
HEX Copy
background: #FFEE58; background: radial-gradient(at 71% 25%, #FFEE58, transparent 70%), radial-gradient(at 75% 71%, #FF7043, transparent 70%), radial-gradient(at 29% 75%, #9CCC65, transparent 70%), radial-gradient(at 25% 29%, #FFCA28, transparent 70%), #FFEE58;
RGBA Copy
background: rgba(255, 238, 88, 1.0); background: radial-gradient(at 71% 25%, rgba(255, 238, 88, 1.0), transparent 70%), radial-gradient(at 75% 71%, rgba(255, 112, 67, 1.0), transparent 70%), radial-gradient(at 29% 75%, rgba(156, 204, 101, 1.0), transparent 70%), radial-gradient(at 25% 29%, rgba(255, 202, 40, 1.0), transparent 70%), rgba(255, 238, 88, 1.0);
HSLA Copy
background: hsla(54, 100%, 67%, 1.0); background: radial-gradient(at 71% 25%, hsla(54, 100%, 67%, 1.0), transparent 70%), radial-gradient(at 75% 71%, hsla(14, 100%, 63%, 1.0), transparent 70%), radial-gradient(at 29% 75%, hsla(88, 50%, 60%, 1.0), transparent 70%), radial-gradient(at 25% 29%, hsla(45, 100%, 58%, 1.0), transparent 70%), hsla(54, 100%, 67%, 1.0);
More Gradient Presets
FAQ
What is the Citrus Splash gradient?Yellow, orange, and lime mesh blobs bursting from their own sunny base.
What's the CSS code for the Citrus Splash gradient?
Use
background: radial-gradient(at 71% 25%, #FFEE58, transparent 70%), radial-gradient(at 75% 71%, #FF7043, transparent 70%), radial-gradient(at 29% 75%, #9CCC65, transparent 70%), radial-gradient(at 25% 29%, #FFCA28, transparent 70%), #FFEE58;. RGBA and HSLA versions are also available on this page.