12 Shades of Silver with Hex Codes

Named Silver Colors and Their Hex Codes

Ordered darkest to lightest. Names marked CSS are color keywords you can write directly in a stylesheet; the rest are common design and print names. Select any swatch for its full breakdown.

SilverColor Chart: Hex, RGB, HSL & CMYK

Every silver above in all four common formats. CMYK is a mathematical approximation for planning; confirm production print colors with your printer and ICC profile.

Silver Scale from Light to Dark

A 12-step lightness scale built from the core silver hue, holding hue and saturation constant. This is the shape of a design-system color ramp. Select any swatch for the full breakdown of that color.

Need a perceptually even ramp with semantic roles and contrast evidence? Generate silver design tokens.

What Silver Communicates

Like gold, silver on screen is a gradient effect rather than a color. The CSS keyword `silver` is #C0C0C0, a plain light gray. What makes an element look metallic is the run from a darker gray through a near-white highlight and back, not any single hex value.

Where silver works well

• Metallic gradients for badges, medals, and awards
• Cool neutral surfaces in technology and automotive brands
• Secondary tiers alongside a gold primary
• Borders and dividers where a plain gray would look flat

Colors that pair with silver

Copy the Silver Palette as CSS

Every shade on this page as CSS custom properties, ready to paste into a stylesheet.

:root {
  --silver-steel: #71797E;
  --silver-gray: #808080;
  --silver-titanium: #878681;
  --silver-pewter-silver: #899499;
  --silver-darkgray: #A9A9A9;
  --silver-aluminium: #A9ACB6;
  --silver-silver: #C0C0C0;
  --silver-lightgray: #D3D3D3;
  --silver-gainsboro: #DCDCDC;
  --silver-chrome: #DBE4EB;
  --silver-platinum: #E5E4E2;
  --silver-whitesmoke: #F5F5F5;
}

Silver Color Questions