Advertise on WebGradients — reach designers & frontend developers.Learn more
#9795F0
#FBC8D4

Linear CSS gradient

#059 Teen Notebook Gradient

Teen Notebook runs flowing upward from bottom to top, blending lavender (#9795F0) and blush pink (#FBC8D4) in a soft two colour stops linear CSS gradient.

The low-contrast softness makes this gradient versatile as a background layer — readable and soothing at the same time.

Works well for health and wellness apps, baby product sites, soft UI card backgrounds. Copy the CSS snippet below and apply it directly — no preprocessor or build step required.

Color palette

ColorHEXRGB
#9795F0rgb(151, 149, 240)
#FBC8D4rgb(251, 200, 212)

CSS code

background-image: linear-gradient(to top, #9795f0 0%, #fbc8d4 100%);

#059 Teen Notebook Gradient preview