Palette

Lavender Dream Haze

Soft, ethereal purples reminiscent of endless lavender fields swaying gently under a summer sky.

pastelcalm5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lavender Dream Haze 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 Dream Haze.

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

Data visualization

#E6D0ED#C3A6D6#9B7BAB#7A5B8E#A38DA6

Palette guide

How to use Lavender Dream Haze

Overview

The Lavender Dream Haze palette offers a deeply tranquil and ethereal collection of purples, perfect for designs seeking a sophisticated, calming, and introspective mood. It opens with the delicate #E6D0ED, flowing into the gentle #C3A6D6 and the more muted #9B7BAB. The palette grounds itself with the rich #7A5B8E, while #A38DA6 provides a balanced, earthy touch. These harmonious hues are ideal for creating an atmosphere of soft elegance and introspection, reminiscent of endless lavender fields under a hazy summer sky. Designers will find this palette versatile for luxury branding, serene digital environments, or meditative print materials.

Best used for

Luxury spa and relaxation branding
High-end fashion or beauty websites
Meditation and mindfulness apps
Abstract art and photography backdrops
Interior design for serene bedrooms
Ethereal wedding or event stationery

Suggested color roles

primary

#9B7BAB serves as a sophisticated primary color, excellent for main headings, brand logos, or key graphical elements, providing a subtle anchor.

secondary

#C3A6D6 offers a soft, supportive tone, ideal for subheadings, background panels, or secondary information, maintaining the palette's gentle flow.

accent

#7A5B8E provides a deeper, more pronounced accent, perfect for call-to-action buttons, interactive elements, or important highlights, adding a touch of richness.

background

#E6D0ED is a very light, almost translucent background, creating an open and airy canvas that enhances content and promotes a sense of tranquility.

text

#7A5B8E offers good readability for body text on lighter backgrounds. For maximum contrast, a dark charcoal or black text can be paired effectively.

Accessibility notes

Ensure text in #7A5B8E on #E6D0ED or #C3A6D6 backgrounds meets WCAG AA contrast standards.
Avoid using #C3A6D6 text on #E6D0ED for critical information due to potential low contrast.
Use #7A5B8E for interactive elements to ensure they are visually distinct and perceivable.
Test the palette's subtle color shifts carefully, especially for users with color vision deficiencies, to ensure all elements are discernable.

Recommended combinations

Hazy Gradient

Ideal for soft background gradients, subtle UI element layering, or creating an atmospheric, dreamlike visual flow.

#E6D0ED · #C3A6D6 · #9B7BAB

Deep Elegance

Effective for establishing visual depth in headers, footers, or feature sections, providing strong yet sophisticated contrast.

#9B7BAB · #7A5B8E · #A38DA6

Calm UI

Suitable for designing serene interfaces, with a light background, a balanced mid-tone, and a deep, legible color for text and accents.

#E6D0ED · #A38DA6 · #7A5B8E

CSS variables

:root {
  --lavender-dream-haze-1: #E6D0ED;
  --lavender-dream-haze-2: #C3A6D6;
  --lavender-dream-haze-3: #9B7BAB;
  --lavender-dream-haze-4: #7A5B8E;
  --lavender-dream-haze-5: #A38DA6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lavender-dream-haze": {
        1: "#E6D0ED",
        2: "#C3A6D6",
        3: "#9B7BAB",
        4: "#7A5B8E",
        5: "#A38DA6",
      }
    }
  }
}

Hex values

Color 1#E6D0ED

Color 2#C3A6D6

Color 3#9B7BAB

Color 4#7A5B8E

Color 5#A38DA6

Accessibility

Contrast checker

1.5:1Fail

2.5:1Fail

3.9:1AA18

2.1:1Fail

1.5:1Fail

1.7:1Fail

2.6:1Fail

1.4:1Fail

2.5:1Fail

1.7:1Fail

1.6:1Fail

1.2:1Fail

3.9:1AA18

2.6:1Fail

1.6:1Fail

1.9:1Fail

2.1:1Fail

1.4:1Fail

1.2:1Fail

1.9:1Fail

Similar palettes

More like Lavender Dream Haze

Lavender Field Dreams

Lavender Field Haze

Lavender Field Whisper