Back to palettes

Palette

Lunar Bloom Garden

Dreamy, soft hues inspired by flowers blooming under the pale glow of moonlight, creating a serene, magical atmosphere.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lunar Bloom Garden 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 Bloom Garden.

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

Data visualization

#F5F5DC#B0C4DE#87CEEB#DDA0DD#4682B4

Palette guide

How to use Lunar Bloom Garden

Overview

The Lunar Bloom Garden palette is a serene and ethereal collection inspired by flowers blooming under the soft glow of moonlight. It features a creamy off-white (#F5F5DC), a gentle light steel blue (#B0C4DE), a vibrant sky blue (#87CEEB), a delicate plum (#DDA0DD), and a deeper steel blue (#4682B4). This palette is perfect for designers and developers seeking to create dreamy, tranquil, or magical visual experiences. Its soft blues and purples, grounded by a warm cream, evoke a sense of calm, femininity, and whimsical charm, ideal for projects that require a touch of elegance and fantasy.

Best used for

  • Spa and wellness branding and websites
  • Feminine product packaging and marketing
  • Wedding invitations and event decor
  • Fantasy art and illustrations
  • Baby product design and nurseries
  • Dreamy digital interfaces

Suggested color roles

primary

Use #B0C4DE as a calming primary color for backgrounds or large content areas, establishing a peaceful atmosphere.

secondary

Employ #DDA0DD for secondary elements, accents, or navigation to introduce a touch of delicate magic and warmth.

accent

Apply #87CEEB as a bright, ethereal accent for calls-to-action, highlights, or decorative details, mimicking moonlight.

background

Utilize #F5F5DC for a soft, moonlit base, or a pure white to enhance the pastel qualities of the other colors.

text

For optimal legibility, use #4682B4 for primary text on lighter backgrounds, or a dark charcoal like #333333 for maximum contrast.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using light pastels like #F5F5DC and #B0C4DE.
  • Avoid using similar light hues for interactive elements; provide clear visual differentiation.
  • Test text readability with various font sizes and weights, particularly for decorative fonts.
  • Consider providing a dark mode option where colors are adapted for better contrast in low light.

Recommended combinations

Moonlit Serenity

Creates a soft, tranquil, and dreamy ambiance, perfect for calming designs.

#F5F5DC · #B0C4DE · #DDA0DD

Garden Bloom

Offers a vibrant yet harmonious floral feel, ideal for romantic or magical themes.

#87CEEB · #DDA0DD · #4682B4

Ethereal Glow

Provides a cool, sophisticated blend of blues with a soft highlight, suitable for elegant interfaces.

#B0C4DE · #F5F5DC · #4682B4

CSS variables

:root {
  --lunar-bloom-garden-1: #F5F5DC;
  --lunar-bloom-garden-2: #B0C4DE;
  --lunar-bloom-garden-3: #87CEEB;
  --lunar-bloom-garden-4: #DDA0DD;
  --lunar-bloom-garden-5: #4682B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lunar-bloom-garden": {
        1: "#F5F5DC",
        2: "#B0C4DE",
        3: "#87CEEB",
        4: "#DDA0DD",
        5: "#4682B4",
      }
    }
  }
}

Related searches

moonlight color palettesoft floral colorsethereal blue purpledreamy pastel schemeserene garden hues

Palette colors

Hex values

Color 1#F5F5DC
·
Color 2#B0C4DE
·
Color 3#87CEEB
·
Color 4#DDA0DD
·
Color 5#4682B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.6:1Fail
1.9:1Fail
3.7:1AA18
2
1.6:1Fail
1:1Fail
1.2:1Fail
2.3:1Fail
3
1.6:1Fail
1:1Fail
1.2:1Fail
2.4:1Fail
4
1.9:1Fail
1.2:1Fail
1.2:1Fail
2:1Fail
5
3.7:1AA18
2.3:1Fail
2.4:1Fail
2:1Fail

Similar palettes

More like Lunar Bloom Garden

View all pastel