Palette

Silver Moonlight

A graceful gradient of silver-greys and whites evokes the serene and ethereal glow of moonlight on a clear night.

monochromeminimal5 colors

More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Silver Moonlight reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Silver Moonlight.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#F5F5F5#E0E0E0#C0C0C0#A0A0A0#808080

Palette guide

How to use Silver Moonlight

Overview

The Silver Moonlight palette offers a graceful gradient of silver-greys and whites, evoking the serene and ethereal glow of moonlight on a clear night. This minimalist collection features the luminous #F5F5F5, the soft #E0E0E0, the balanced #C0C0C0, the subtle #A0A0A0, and the grounding #808080. For designers and developers, these shades provide a sophisticated and tranquil foundation, perfect for creating interfaces and branding that convey elegance, calm, and a modern aesthetic. It’s an excellent choice for projects where a clean, uncluttered, and subtly dramatic visual experience is desired, ensuring harmony and focus.

Best used for

High-tech product interfaces
Luxury minimalist branding
Photography portfolios and galleries
Modern art installations and exhibitions
E-commerce for sleek electronics
Night-themed events or applications

Suggested color roles

primary

Utilize #C0C0C0 as a balanced, classic silver-grey for main content areas or prominent UI elements.

secondary

Employ #E0E0E0 for light, subtle support, ideal for secondary information or delicate backgrounds.

accent

Apply #808080 for the deepest tone, providing strong contrast, emphasis for key information, or interactive elements.

background

Choose #F5F5F5 as a clean, luminous background to create an expansive and airy canvas.

text

For excellent readability on light backgrounds like #F5F5F5, use #808080 for primary body text.

Accessibility notes

#808080 offers strong contrast for text on #F5F5F5 and #E0E0E0, ensuring readability for all users.
#A0A0A0 can be used for secondary text on #F5F5F5, but always verify WCAG AA compliance for smaller sizes.
Avoid using #E0E0E0 or #C0C0C0 for small text on #F5F5F5 due to potential low contrast issues.
Ensure interactive elements are clearly distinguishable, perhaps by using #808080 for states like hover or focus.

Recommended combinations

Moonlit Glow

Creates a soft, radiant gradient ideal for backgrounds, headers, or subtle overlays.

#F5F5F5 · #E0E0E0 · #C0C0C0

Deep Shadow

Provides a stark yet elegant contrast, perfect for main text on background or highlighting key features.

#F5F5F5 · #808080 · #E0E0E0

Grayscale Depth

Offers a smooth, increasing intensity for layered panels, data visualization, or progressive disclosure.

#C0C0C0 · #A0A0A0 · #808080

CSS variables

:root {
  --silver-moonlight-1: #F5F5F5;
  --silver-moonlight-2: #E0E0E0;
  --silver-moonlight-3: #C0C0C0;
  --silver-moonlight-4: #A0A0A0;
  --silver-moonlight-5: #808080;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "silver-moonlight": {
        1: "#F5F5F5",
        2: "#E0E0E0",
        3: "#C0C0C0",
        4: "#A0A0A0",
        5: "#808080",
      }
    }
  }
}

Hex values

Color 1#F5F5F5

Color 2#E0E0E0

Color 3#C0C0C0

Color 4#A0A0A0

Color 5#808080

Accessibility

Contrast checker

1.2:1Fail

1.7:1Fail

2.4:1Fail

3.6:1AA18

1.2:1Fail

1.4:1Fail

2:1Fail

3:1Fail

1.7:1Fail

1.4:1Fail

2.2:1Fail

2.4:1Fail

2:1Fail

1.4:1Fail

1.5:1Fail

3.6:1AA18

3:1Fail

2.2:1Fail

1.5:1Fail

Similar palettes

More like Silver Moonlight

Silver Moonlight

See it in context.

Ready when you are.

Built with Silver Moonlight.

How to use Silver Moonlight

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Moonlit Glow

Deep Shadow

Grayscale Depth

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Silver Moonlight