Advertise on WebGradients — reach designers & frontend developers.Learn more
#874DA2
#C43A30

Linear CSS gradient

#108 Le Cocktail Gradient

Le Cocktail is a smooth linear CSS gradient angled at 45° toward the upper right, built from violet (#874DA2) and red (#C43A30) across two colour stops.

The balanced colour range transitions cleanly, giving designers a flexible base that adapts to both light and dark surrounding palettes.

Works well for hero section backgrounds, marketing landing pages, UI card surfaces. Copy the CSS snippet below and apply it directly — no preprocessor or build step required.

Color palette

ColorHEXRGB
#874DA2rgb(135, 77, 162)
#C43A30rgb(196, 58, 48)

CSS code

background-image: linear-gradient(45deg, #874da2 0%, #c43a30 100%);

#108 Le Cocktail Gradient preview