Back to palettes

Palette

Lunar Dust Veil

A cool, ethereal palette capturing the subtle shades and silent beauty of lunar dust under faint light.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lunar Dust Veil 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 Dust Veil.

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

Data visualization

#A8AFB3#CACFD4#E1E4E6#82878A#C6CDD1

Palette guide

How to use Lunar Dust Veil

Overview

The 'Lunar Dust Veil' palette offers a cool, ethereal collection capturing the subtle shades of lunar dust under faint light. This sophisticated monochrome range moves from the light #E1E4E6 to the deeper #82878A, including balanced mid-tones like #A8AFB3 and #CACFD4. Designers and developers seeking a refined, calm, and professional aesthetic will find this palette highly versatile. Its muted, slightly blue-tinged greys create a serene and elegant atmosphere, ideal for projects that require a touch of understated luxury and clarity without being overtly stark.

Best used for

  • Professional services and corporate websites
  • Minimalist product design and branding
  • Scientific publications and data presentation
  • Architectural firm portfolios and marketing
  • Serene mobile app interfaces and themes
  • Luxury brand identity and packaging

Suggested color roles

primary

Utilize #82878A as a strong, cool foundational grey for primary text, important buttons, or significant UI elements.

secondary

Apply #A8AFB3 for supporting content, subheadings, or secondary interactive components to add depth.

accent

Use #C6CDD1 as a subtle accent for delicate borders, hover states, or less prominent graphical details.

background

Choose #E1E4E6 for a clean, light, and unobtrusive main background, allowing content to stand out.

text

Employ #82878A for primary body text on lighter backgrounds, ensuring excellent readability and a cohesive cool tone.

Accessibility notes

  • Text in #82878A on #E1E4E6 should have good contrast; verify with a contrast checker for all usage.
  • Avoid using #C6CDD1 or #CACFD4 for small text on #E1E4E6 due to potentially low contrast ratios.
  • Always use the darker shades (#82878A, #A8AFB3) for important text and interactive elements to ensure readability.
  • Ensure sufficient contrast for button states, links, and icons against lighter backgrounds within the palette.

Recommended combinations

Cool Foundation

Creates a light, airy base for web pages or app screens, offering a clean and professional appearance.

#E1E4E6 · #CACFD4 · #A8AFB3

Subtle Depth

Ideal for layered UI elements or content blocks, providing gentle visual separation and sophistication.

#82878A · #A8AFB3 · #C6CDD1

Refined UI

Suitable for creating clean, modern interface components like cards, navigation, or form fields.

#C6CDD1 · #CACFD4 · #82878A

CSS variables

:root {
  --lunar-dust-veil-3-1: #A8AFB3;
  --lunar-dust-veil-3-2: #CACFD4;
  --lunar-dust-veil-3-3: #E1E4E6;
  --lunar-dust-veil-3-4: #82878A;
  --lunar-dust-veil-3-5: #C6CDD1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lunar-dust-veil-3": {
        1: "#A8AFB3",
        2: "#CACFD4",
        3: "#E1E4E6",
        4: "#82878A",
        5: "#C6CDD1",
      }
    }
  }
}

Related searches

cool grey color palettesubtle blue-grey colorsprofessional monochrome UIcalm minimalist designmodern business branding colors

Palette colors

Hex values

Color 1#A8AFB3
·
Color 2#CACFD4
·
Color 3#E1E4E6
·
Color 4#82878A
·
Color 5#C6CDD1
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.7:1Fail
1.6:1Fail
1.4:1Fail
2
1.4:1Fail
1.2:1Fail
2.3:1Fail
1:1Fail
3
1.7:1Fail
1.2:1Fail
2.8:1Fail
1.3:1Fail
4
1.6:1Fail
2.3:1Fail
2.8:1Fail
2.3:1Fail
5
1.4:1Fail
1:1Fail
1.3:1Fail
2.3:1Fail

Similar palettes

More like Lunar Dust Veil

View all monochrome