Advertise on WebGradients — reach designers & frontend developers.Learn more
#FF3CAC
#562B7C
#2B86C5

Linear CSS gradient

#175 Magic Ray Gradient

Magic Ray blends hot pink (#FF3CAC), indigo (#562B7C), and cyan (#2B86C5) in a vivid linear CSS gradient across 3 colour stops.

The rich saturation ensures strong visual presence even at small sizes — useful for icons, badges, and accent strips.

Works well for sports and fitness apps, brand campaign pages, digital art portfolios. Copy the CSS snippet below and apply it directly — no preprocessor or build step required.

Color palette

ColorHEXRGB
#FF3CACrgb(255, 60, 172)
#562B7Crgb(86, 43, 124)
#2B86C5rgb(43, 134, 197)

CSS code

background-image: linear-gradient(-225deg, #FF3CAC 0%, #562B7C 52%, #2B86C5 100%);

#175 Magic Ray Gradient preview