Dawn

A vibrant blend of Jaffa orange and East Bay blue, reminiscent of a stunning dawn.

🎨 Use this gradient for a lively, energetic design.

💡 This gradient mirrors the colors of a sunrise over the East Bay area.

Jaffa
#F3904F
East Bay
#3B4371

CSS Linear Gradient Code

/* Dawn CSS Linear Gradient Background */
.gradient {
  background: #F3904F;
  background: linear-gradient(
    to right,
    #F3904F,#3B4371
  );
}

TailwindCSS Logo TailwindCSS Linear Gradient

/* Dawn TailwindCSS Linear Gradient */
<div class="bg-gradient-to-r from-[#F3904F] to-[#3B4371]"></div>

Dawn - 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 Dawn color palette gradient background 👍
November 15, 2024 at 8:46 AM

CSS Linear Gradient Button

Home
Why Dawn?

Linear Gradient Border

Dawn
Share

CSS Font Gradient

The Best Dawn Tailwind CSS Landing Pages

Shade of Dawn

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