Back to palettes

Palette

Lavender Bloom Echo

A gentle and soothing array, capturing the serene fragrance and delicate beauty of a lavender field.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lavender Bloom Echo 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 Bloom Echo.

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

Data visualization

#E6E6FA#D8BFD8#C9A1D8#A48BB9#8C7BA2

Palette guide

How to use Lavender Bloom Echo

Overview

The Lavender Bloom Echo palette offers a gentle and soothing array, capturing the serene fragrance and delicate beauty of a lavender field. This tranquil collection, featuring soft purples like the airy #E6E6FA, the delicate #C9A1D8, and the deeper #8C7BA2, is perfect for designers and developers aiming to evoke peace, elegance, and natural calm. It offers a harmonious blend of light pastels and richer, muted purples, providing versatility for both soft aesthetics and understated sophistication. This palette is excellent for projects requiring a calm, inviting, and graceful visual experience.

Best used for

  • Wellness and beauty product branding
  • Wedding invitations and event stationery
  • Feminine and elegant web design
  • Relaxation and meditation app interfaces
  • Home decor and textile design
  • Personal blogs and lifestyle content

Suggested color roles

primary

Use #8C7BA2 as the foundational color for main headings or brand elements, providing a grounding, muted purple.

secondary

Employ #A48BB9 for supporting sections, subheadings, or larger content blocks to maintain a cohesive, soft feel.

accent

Highlight interactive elements or key information with #C9A1D8, offering a delicate yet distinct pop.

background

Utilize #E6E6FA as a clean, airy background, ensuring excellent readability and a soft visual base.

text

For body text, #8C7BA2 or a dark charcoal ensures high readability against lighter backgrounds like #E6E6FA.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when pairing mid-tones like #D8BFD8 with #C9A1D8.
  • Dark text like #8C7BA2 on #E6E6FA provides excellent readability for headings and important callouts.
  • For small text, avoid using #A48BB9 on #C9A1D8; opt for a darker text color or a lighter background.
  • The lightest color, #E6E6FA, works well as a background for nearly all other palette colors for text.

Recommended combinations

Bloom & Echo

Ideal for main UI elements, navigation, and primary content areas, creating a calm and elegant look.

#8C7BA2 · #A48BB9 · #E6E6FA

Soft Petals

Perfect for subtle gradients, secondary content blocks, or decorative accents that require a delicate touch.

#D8BFD8 · #C9A1D8 · #E6E6FA

Lavender Haze

Suitable for headers, decorative elements, or creating a cohesive, layered visual effect.

#8C7BA2 · #C9A1D8 · #D8BFD8

CSS variables

:root {
  --lavender-bloom-echo-1: #E6E6FA;
  --lavender-bloom-echo-2: #D8BFD8;
  --lavender-bloom-echo-3: #C9A1D8;
  --lavender-bloom-echo-4: #A48BB9;
  --lavender-bloom-echo-5: #8C7BA2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lavender-bloom-echo": {
        1: "#E6E6FA",
        2: "#D8BFD8",
        3: "#C9A1D8",
        4: "#A48BB9",
        5: "#8C7BA2",
      }
    }
  }
}

Related searches

lavender color palette designsoft purple hex codesserene floral themepastel bloom colorscalming design palette

Palette colors

Hex values

Color 1#E6E6FA
·
Color 2#D8BFD8
·
Color 3#C9A1D8
·
Color 4#A48BB9
·
Color 5#8C7BA2
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.8:1Fail
2.4:1Fail
3.1:1AA18
2
1.4:1Fail
1.3:1Fail
1.8:1Fail
2.3:1Fail
3
1.8:1Fail
1.3:1Fail
1.4:1Fail
1.8:1Fail
4
2.4:1Fail
1.8:1Fail
1.4:1Fail
1.3:1Fail
5
3.1:1AA18
2.3:1Fail
1.8:1Fail
1.3:1Fail

Similar palettes

More like Lavender Bloom Echo

View all pastel