CSS Gradient Generator

White gradients for light, clean backgrounds: pure white into soft greys, or white with a pale hint of color. A subtle gradient gives a white page depth without losing its clean look. Hover a gradient to see its colors, or click it to open it in the generator and customize it.

White Gradients

FAQ

How do I make a white gradient in CSS?

Go from pure white to a very light grey or a pale tint, for example linear-gradient(135deg, #FFFFFF 0%, #EDEBEA 50%, #FBF0EC 100%). Keep the change small so the background still reads as white.

Why use a white gradient instead of plain white?

A gentle white gradient adds depth to large light areas, separates sections without hard lines, and looks softer than flat white.