#053 Soft Grass Gradient

Soft Grass runs flowing upward from bottom to top, blending mint (#C1DFC4) and mint (#DEECDD) 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

#C1DFC4rgb(193, 223, 196)

#DEECDDrgb(222, 236, 221)

CSS code

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

#053 Soft Grass Gradient

Color palette

CSS code

#053 Soft Grass Gradient preview