Palette

Lunar Surface Chill

Stark and quiet blues and greys, depicting the desolate, serene beauty of the lunar landscape.

coolminimal5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lunar Surface Chill 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 Lunar Surface Chill.

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

Data visualization

#4C5F6C#708492#94A8B6#B8CBD9#DCEBF2

Palette guide

How to use Lunar Surface Chill

Overview

The Lunar Surface Chill palette offers a serene, minimalist aesthetic through its range of cool, desaturated blues and greys. From the deep #4C5F6C to the airy #DCEBF2, including the balanced #708492, #94A8B6, and #B8CBD9, this collection perfectly captures the desolate yet beautiful essence of the lunar landscape. It's an excellent choice for designers and developers aiming for clean, modern interfaces that convey tranquility and precision. The subtle variations allow for depth without sacrificing the overall calm and sophisticated feel, making it versatile for various digital applications requiring a cool, understated presence.

Best used for

Minimalist website designs and portfolios
Tech product interfaces and dashboards
Scientific or educational content platforms
Healthcare or wellness application UI
Modern architectural visualization
Corporate branding with a sophisticated edge

Suggested color roles

primary

Use #4C5F6C for strong foundational elements, headers, or primary calls-to-action, establishing a cool, stable base.

secondary

Apply #708492 for supporting content, subheadings, or active states, providing gentle contrast.

accent

Employ #B8CBD9 to subtly highlight interactive elements or important information, bringing a touch of luminosity.

background

Utilize #DCEBF2 as a clean, expansive background color, creating a light and airy feel reminiscent of open space.

text

For optimal readability, use #4C5F6C or a deep charcoal on lighter backgrounds like #DCEBF2, or white text on #4C5F6C.

Accessibility notes

Ensure sufficient contrast when using #708492 or #94A8B6 for text on #DCEBF2; consider darker alternatives.
Prioritize #4C5F6C for body text on light backgrounds to meet WCAG AA standards.
Avoid pairing #94A8B6 and #B8CBD9 for critical information due to their low contrast with each other.
Test text and interactive elements thoroughly, especially for users with visual impairments, on all color combinations.

Recommended combinations

Clean Horizon

Ideal for a crisp, bright interface with dark text and a light accent for buttons or icons.

#DCEBF2 · #4C5F6C · #B8CBD9

Subtle Depth

Great for showcasing content, using the darkest as a container, mid-tone for details, and lightest for text.

#4C5F6C · #708492 · #DCEBF2

Muted Contrast

Effective for card backgrounds, with a mid-tone base, dark text, and a pale highlight for emphasis.

#94A8B6 · #4C5F6C · #DCEBF2

CSS variables

:root {
  --lunar-surface-chill-2-1: #4C5F6C;
  --lunar-surface-chill-2-2: #708492;
  --lunar-surface-chill-2-3: #94A8B6;
  --lunar-surface-chill-2-4: #B8CBD9;
  --lunar-surface-chill-2-5: #DCEBF2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lunar-surface-chill-2": {
        1: "#4C5F6C",
        2: "#708492",
        3: "#94A8B6",
        4: "#B8CBD9",
        5: "#DCEBF2",
      }
    }
  }
}

Hex values

Color 1#4C5F6C

Color 2#708492

Color 3#94A8B6

Color 4#B8CBD9

Color 5#DCEBF2

Accessibility

Contrast checker

1.7:1Fail

2.7:1Fail

4:1AA18

5.4:1AA

1.7:1Fail

1.6:1Fail

2.3:1Fail

3.2:1AA18

2.7:1Fail

1.6:1Fail

1.5:1Fail

2:1Fail

4:1AA18

2.3:1Fail

1.5:1Fail

1.4:1Fail

5.4:1AA

3.2:1AA18

2:1Fail

1.4:1Fail

Similar palettes

More like Lunar Surface Chill

Arctic Shoreline Chill

Celestial Cloud Swirl