Gradient Page

Orange Fun

A vibrant blend of Pomegranate and Saffron, embodying the zest of Orange Fun.

🎨 Use this gradient to add a lively touch to your designs.

💡 Orange, a blend of red and yellow, symbolizes joy and creativity in color psychology.

CSS Linear Gradient Code

/* Orange Fun CSS Linear Gradient Background */
.gradient {
  background: #fc4a1a;
  background: linear-gradient(
    to right,
    #fc4a1a,#f7b733
  );
}

TailwindCSS Logo TailwindCSS Linear Gradient

/* Orange Fun TailwindCSS Linear Gradient */
<div class="bg-gradient-to-r from-[#fc4a1a] to-[#f7b733]"></div>

Orange Fun - 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 Orange Fun color palette gradient background 👍
December 10, 2025 at 10:12 AM

CSS Linear Gradient Button

Home
Why Orange Fun?

Linear Gradient Border

Orange Fun
Share

CSS Font Gradient

The Best Orange Fun Tailwind CSS Landing Pages

Shade of Orange Fun

We hope you enjoyed Orange Fun. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names
Orange Fun Gradient CSS | 2 Color Linear UI Gradient Generator