Advertise on WebGradients — reach designers & frontend developers.Learn more
#C471F5
#FA71CD

Linear CSS gradient

#046 Mixed Hopes Gradient

A bold linear CSS gradient flowing upward from bottom to top, Mixed Hopes blends violet (#C471F5) and fuchsia (#FA71CD) in two colour stops.

The electric, high-saturation hues deliver instant visual impact and give any interface an energetic, forward-looking edge.

Works well for gaming UIs, nightlife event pages, bold call-to-action sections. Copy the CSS snippet below and apply it directly — no preprocessor or build step required.

Color palette

ColorHEXRGB
#C471F5rgb(196, 113, 245)
#FA71CDrgb(250, 113, 205)

CSS code

background-image: linear-gradient(to top, #c471f5 0%, #fa71cd 100%);

#046 Mixed Hopes Gradient preview