Back to palettes

Palette

Moonlit Garden Path

Soft, silvery blues that capture the ethereal glow of a moonlit garden path after dusk.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Moonlit Garden Path 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 Moonlit Garden Path.

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

Data visualization

#2B3D4A#4C6F8E#7E9CBB#ADBEE5#D9E7FF

Palette guide

How to use Moonlit Garden Path

Overview

The Moonlit Garden Path palette offers a serene collection of soft, silvery blues that evoke the ethereal glow of a garden after dusk. This cool-toned selection is perfect for designs seeking a calm, sophisticated, and slightly mystical atmosphere. From the deep blue-gray of #2B3D4A, through the tranquil mid-tone #7E9CBB, to the airy lightness of #D9E7FF, these colors provide a versatile range for creating inviting digital experiences. Designers and developers can utilize this palette to craft interfaces that feel open, clean, and deeply relaxing, making it suitable for a variety of applications requiring a touch of elegance and peacefulness.

Best used for

  • Serene wellness and meditation applications
  • Elegant wedding stationery and branding
  • Luxury spa and resort websites
  • Ethereal digital art and illustrations
  • Clean and calm user interfaces
  • Nature-inspired home decor branding

Suggested color roles

primary

Use #2B3D4A as a grounding deep blue-gray for main headings, footers, or dark mode backgrounds.

secondary

Employ #4C6F8E for supporting content blocks, secondary navigation, or subtle brand accents.

accent

Apply #ADBEE5 or #D9E7FF for bright highlights, interactive elements, or ethereal graphic details.

background

The lightest shade, #D9E7FF, serves as an excellent clean, airy background, while #2B3D4A can create a deep, immersive canvas.

text

For text on light backgrounds like #D9E7FF, use #2B3D4A or #4C6F8E. On dark backgrounds, #D9E7FF provides clear readability.

Accessibility notes

  • Ensure sufficient contrast for text using #4C6F8E on lighter backgrounds like #D9E7FF.
  • Text in #2B3D4A on #D9E7FF offers excellent readability for most content.
  • Avoid using #ADBEE5 or #D9E7FF for critical text elements on very light backgrounds.
  • Always verify contrast ratios for interactive elements to meet WCAG standards.

Recommended combinations

Ethereal Sky

Creates a light, airy background with a clear mid-tone for elements and a strong dark for text or prominent features.

#D9E7FF · #7E9CBB · #2B3D4A

Deep Path

Ideal for a darker themed section, with #2B3D4A as base, #4C6F8E for content, and #ADBEE5 for subtle highlights.

#2B3D4A · #4C6F8E · #ADBEE5

Soft Transition

Excellent for gradients or layered elements, showcasing a smooth, gentle progression of light blues.

#7E9CBB · #ADBEE5 · #D9E7FF

CSS variables

:root {
  --moonlit-garden-path-2-1: #2B3D4A;
  --moonlit-garden-path-2-2: #4C6F8E;
  --moonlit-garden-path-2-3: #7E9CBB;
  --moonlit-garden-path-2-4: #ADBEE5;
  --moonlit-garden-path-2-5: #D9E7FF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "moonlit-garden-path-2": {
        1: "#2B3D4A",
        2: "#4C6F8E",
        3: "#7E9CBB",
        4: "#ADBEE5",
        5: "#D9E7FF",
      }
    }
  }
}

Related searches

serene blue color schemeethereal moonlight palettesoft garden path colorscalm UI design palettecool blue website aesthetic

Palette colors

Hex values

Color 1#2B3D4A
·
Color 2#4C6F8E
·
Color 3#7E9CBB
·
Color 4#ADBEE5
·
Color 5#D9E7FF
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.1:1Fail
3.9:1AA18
6:1AA
9:1AAA
2
2.1:1Fail
1.9:1Fail
2.8:1Fail
4.2:1AA18
3
3.9:1AA18
1.9:1Fail
1.5:1Fail
2.3:1Fail
4
6:1AA
2.8:1Fail
1.5:1Fail
1.5:1Fail
5
9:1AAA
4.2:1AA18
2.3:1Fail
1.5:1Fail

Similar palettes

More like Moonlit Garden Path

View all cool
Lunar Glint
Moonlit Cove
Moonlit Garden Path
Moonlit Riverbed
Nocturne Flora Bloom
Silver Moonlit Glade