Skip to content

White gradient background

A white gradient is barely there: pure white at the top centre fading into whitesmoke and then pale gainsboro grey at the edges. It gives a plain, minimal page a little depth without looking coloured.

Free, no sign-up. Runs in your browser. Nothing you type or upload is sent to us or stored.

At a glance

CSS named colour white
#ffffff
Source: w3.org, checked 2026-11
CSS named colour whitesmoke
#f5f5f5
Source: w3.org, checked 2026-11
CSS named colour gainsboro
#dcdcdc
Source: w3.org, checked 2026-11
CSS named colour snow
#fffafa
Source: w3.org, checked 2026-11
Black text on gainsboro (#dcdcdc)
15.3:1, which passes the 4.5:1 WCAG AA minimum for normal-size text
Source: w3.org, checked 2026-11

Want a page that already looks finished?

A free Liite page comes with 15 themes, from soft sunset tones to plain black and white, plus gradient and pattern wallpapers of your own. Pick one, add your links, and your page is live at liite.co/yourname.

Make your free page

White gradient background: what to know

This page starts the background generator for this case. For every option and how to use it, see the background generator.

Check it on more than one screen

Near-white shades look different from screen to screen. On a dim phone the fade can vanish, and on a bright monitor it can look greyer than you meant. Preview the PNG on the screen your audience will use. For a warmer white, swap whitesmoke for snow (#fffafa) or ivory (#fffff0).

Questions

What is a minimal gradient background?

One with two or three colours very close together, like white into light grey here, so you notice depth more than colour.

Will black text work on it?

Yes. Black text has strong contrast over the whole gradient, even at the grey edges.