Back to palettes

Palette

Lavender Mist Garden

A gentle and calming blend of purples and blues, reminiscent of a lavender field on a misty morning.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lavender Mist 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 Lavender Mist Garden.

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

Data visualization

#C8A2C8#B0E0E6#DDA0DD#F0F8FF#A56B8F

Palette guide

How to use Lavender Mist Garden

Overview

The Lavender Mist Garden palette is a gentle and calming blend of purples and cool blues, reminiscent of a serene lavender field on a misty morning. Featuring the soft #C8A2C8, the airy #B0E0E6, and the delicate #DDA0DD, complemented by the crisp #F0F8FF and the grounding #A56B8F. This palette is an excellent choice for designers and developers seeking a fresh, natural, and inviting aesthetic. Ideal for branding, user interfaces, or digital art that aims to convey peace, organic beauty, and a touch of dreamy elegance. Its harmonious blend creates a cohesive and visually pleasing experience.

Best used for

  • Spa and wellness branding
  • Floral design and nurseries
  • Eco-friendly product packaging
  • Nature-themed mobile apps
  • Relaxation and mindfulness content
  • Artistic photography websites

Suggested color roles

primary

Use #A56B8F as a grounding primary color for branding, main headers, or important call-to-actions, conveying natural elegance.

secondary

Apply #C8A2C8 for supporting elements, subheadings, or background sections that require a softer, calming presence.

accent

Introduce #B0E0E6 or #DDA0DD as refreshing accents for buttons, interactive elements, or decorative details.

background

Utilize #F0F8FF as a crisp, clean background, providing an airy canvas that lets other colors breathe.

text

For primary body text, a dark charcoal or black ensures optimal readability. For headings on #F0F8FF, #A56B8F offers strong contrast.

Accessibility notes

  • Ensure text on #F0F8FF uses a dark enough color like #A56B8F or black to meet WCAG contrast standards.
  • Avoid using #DDA0DD or #C8A2C8 for small text on #F0F8FF due to low contrast, which can hinder readability.
  • The deepest shade, #A56B8F, provides excellent contrast for text against the lightest palette colors for clear messaging.
  • Check contrast ratios carefully when pairing #B0E0E6 with #C8A2C8 for text and background elements.

Recommended combinations

Misty Morning

Creates a fresh, airy feel, suitable for light backgrounds, subtle overlays, or serene design elements.

#C8A2C8 · #B0E0E6 · #F0F8FF

Garden Bloom

Perfect for floral illustrations, headers, or elements needing a gentle, natural pop of color.

#DDA0DD · #A56B8F · #C8A2C8

Cool Contrast

Use for prominent call-to-actions, key headings, or to establish a clear visual hierarchy against a light base.

#A56B8F · #F0F8FF · #B0E0E6

CSS variables

:root {
  --lavender-mist-garden-1: #C8A2C8;
  --lavender-mist-garden-2: #B0E0E6;
  --lavender-mist-garden-3: #DDA0DD;
  --lavender-mist-garden-4: #F0F8FF;
  --lavender-mist-garden-5: #A56B8F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lavender-mist-garden": {
        1: "#C8A2C8",
        2: "#B0E0E6",
        3: "#DDA0DD",
        4: "#F0F8FF",
        5: "#A56B8F",
      }
    }
  }
}

Related searches

lavender blue green palettemisty garden colorssoft floral color schemecalm UI designethereal nature palette

Palette colors

Hex values

Color 1#C8A2C8
·
Color 2#B0E0E6
·
Color 3#DDA0DD
·
Color 4#F0F8FF
·
Color 5#A56B8F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
1.1:1Fail
2.1:1Fail
1.9:1Fail
2
1.5:1Fail
1.4:1Fail
1.3:1Fail
2.9:1Fail
3
1.1:1Fail
1.4:1Fail
1.9:1Fail
2:1Fail
4
2.1:1Fail
1.3:1Fail
1.9:1Fail
3.8:1AA18
5
1.9:1Fail
2.9:1Fail
2:1Fail
3.8:1AA18

Similar palettes

More like Lavender Mist Garden

View all pastel
Lavender Haze Garden
Dreamy Lavender Field
Dreamy Lavender Field
Faded Rosegarden
Gentle Lavender Haze
Lavender Bloom Echo