Launching soon on Product Hunt! - Get Notified

Sun on the Horizon

Sun on the Horizon blends Banana Mania #fceabb with Selective Yellow #f8b500 for a vibrant sunrise effect.

๐ŸŽจ Use this gradient for a warm, energizing design.

๐Ÿ’ก This gradient mimics the colors of a sunrise, symbolizing new beginnings and hope.

CSS Linear Gradient Code

/* Sun on the Horizon CSS Linear Gradient Background */
.gradient {
  background: #fceabb;
  background: linear-gradient(
    to right,

TailwindCSS Logo TailwindCSS Linear Gradient

/* Sun on the Horizon TailwindCSS Linear Gradient */
<div class="bg-gradient-to-r from-[#fceabb] to-[#f8b500]"></div>

Sun on the Horizon - 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
I love this Sun on the Horizon color palette gradient background ๐Ÿ‘
July 14, 2024 at 4:26 PM

CSS Linear Gradient Button

Why Sun on the Horizon?

Linear Gradient Border

Sun on the Horizon

CSS Font Gradient

The Best Sun on the Horizon Tailwind CSS Landing Pages

Shade of Sun on the Horizon

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