Light Blue

A refreshing combination of light blue shades that evoke the tranquility of aquamarine, the vibrancy of spray, and the serenity of Malibu.

🎨 Add a touch of coastal charm to your designs with this invigorating gradient.

💡 Aquamarine is believed to bring good luck and protection to sailors, while Malibu is named after a beautiful beach city in California.

Aquamarine
#9EFBD3
Spray
#57E9F2
Malibu
#45D4FB

CSS Linear Gradient Code

/* Light Blue CSS Linear Gradient Background */
.gradient {
  background: #9EFBD3;
  background: linear-gradient(
    to right,
    #9EFBD3,#57E9F2,#45D4FB
  );
}

TailwindCSS Logo TailwindCSS Linear Gradient

/* Light Blue TailwindCSS Linear Gradient */
<div class="bg-gradient-to-r from-[#9EFBD3] via-[#57E9F2] to-[#45D4FB]"></div>

Light Blue - UI Design Examples

You can use this gradient in your UI design in many ways, for example as a background in a tweet, for buttons or as a text gradient.

Tweet Background Generator

Ilias Ism
Ilias Ism
@illyism
I love this Light Blue color palette gradient background 👍
December 21, 2024 at 4:51 PM

CSS Linear Gradient Button

Home
Why Light Blue?

Linear Gradient Border

Light Blue
Share

CSS Font Gradient

The Best Light Blue Tailwind CSS Landing Pages

Shade of Light Blue

We hope you enjoyed Light Blue. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names
Bluelagoo