Skip to content

Silver gradient background

A silver gradient fakes metal with a bright highlight band between darker greys. This one uses four stops, from dark grey through gainsboro to near-white and back to CSS silver, at a 120° angle.

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 silver
#c0c0c0
Source: w3.org, checked 2026-11
CSS named colour darkgray
#a9a9a9
Source: w3.org, checked 2026-11
CSS named colour gainsboro
#dcdcdc
Source: w3.org, checked 2026-11
CSS named colour whitesmoke
#f5f5f5
Source: w3.org, checked 2026-11
Black text on darkgray (#a9a9a9)
8.9: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

Silver 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.

Making it look more like metal

The shine comes from the sharp bright band. Move the near-white stop closer to its neighbours for a harder reflection, or further away for brushed steel. A slight blue tint in the greys reads as chrome; a warm tint reads as platinum. Keep the angle diagonal, since straight horizontal bands look flat.

Questions

What is the hex code for silver?

CSS silver is #c0c0c0. A single silver looks flat grey, which is why metallic effects mix several greys.

Can I make a gold version?

Yes. Replace the greys with golds such as gold (#ffd700), dark goldenrod and a pale cream for the highlight.