Skip to content

Sunset gradient

A sunset gradient is the one nature publishes every evening: warm light low, cool dark high, because the atmosphere scatters blue light out of the sun's path and leaves the long red wavelengths behind. Every version below keeps that vertical logic, which is why they read as sky and not merely as orange next to purple.

5sunset gradients, ready to use

The two-stop versions are the usable ones, warm into pink or violet, and they take text well on the dark end. Horizon and sunrise add a third stop so the eye gets the full band from gold through rose to dusk. Angle matters more here than anywhere else on this page: sunsets are vertical, and rotating one to 90 degrees quietly breaks the illusion.

Golden hour

Open in generator

linear-gradient(135deg, #FF8A5B, #FF3D77)

Horizon

Open in generator

linear-gradient(180deg, #FFD93D, #FF8A5B, #7A5CFF)

The full band: gold at the horizon line, violet where the night starts.

Dusk

Open in generator

linear-gradient(145deg, #7A5CFF, #FF6B9D)

Last light

Open in generator

linear-gradient(180deg, #FF6B35, #2E1065)

Common questions

What colors are in a sunset gradient?
Gold and orange at the bottom, rose and pink through the middle, violet toward the top, which is the order the sky itself produces. Two stops from that sequence make a clean gradient; three make the postcard. More than four starts striping.
Why do sunset gradients always look right?
Because the reference is overlearned: everyone has seen thousands of real ones, so warm-below-cool reads as natural before any design judgement happens. It is also, conveniently, warm colors blending through their wheel neighbours, so the physics and the color theory agree.
What is the difference between a sunset and a sunrise gradient?
Chemistry aside, dawn skies carry less dust and haze, so a sunrise reads cleaner and paler, peach and soft gold rather than saturated rose. The sunrise version above starts from cream for exactly that reason. In practice the two are interchangeable; the label follows the mood.

Other gradients

Share