Back to palettes

Palette

Ethereal Bloom Mist

A delicate and dreamy palette evoking the soft, diffused colors of blossoms in a misty spring garden.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ethereal Bloom Mist 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 Ethereal Bloom Mist.

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

Data visualization

#FDE2E4#FAD2E1#F6BDDD#E4C1F9#C1F0F7

Palette guide

How to use Ethereal Bloom Mist

Overview

The Ethereal Bloom Mist palette offers a delicate and dreamy collection of pastel hues, perfect for projects seeking a serene and light aesthetic. Inspired by blossoms in a misty spring garden, this palette features soft pinks like #FDE2E4 and #FAD2E1, evolving into the gentle lilac of #F6BDDD. Complementing these are the soft lavender of #E4C1F9 and the airy aqua of #C1F0F7, creating a harmonious and tranquil visual experience. Designers can leverage these shades to evoke feelings of calm, sophistication, and subtle elegance. Developers will appreciate the cohesive nature of these light colors, making them ideal for crafting user interfaces that feel open, inviting, and visually soothing without being overwhelming. This palette is excellent for conveying freshness and a touch of whimsical beauty.

Best used for

  • Feminine branding or product design
  • Baby and children's apparel or nursery decor
  • Wedding invitations and event branding
  • Spa, wellness, or beauty product packaging
  • Lifestyle blogs and serene website designs
  • Digital art and illustration with soft themes

Suggested color roles

primary

#F6BDDD - A gentle, central lilac that grounds the palette, ideal for main brand elements or large content blocks where a soft presence is desired.

secondary

#E4C1F9 - A slightly deeper lavender, perfect for subheadings, secondary calls-to-action, or accentuating key information without overpowering.

accent

#C1F0F7 - A refreshing misty aqua, excellent for interactive elements, subtle highlights, or small graphic details to add a touch of fresh contrast.

background

#FDE2E4 - The lightest pink, serving as a clean, airy base for websites, printed materials, or app interfaces, providing a soft, unobtrusive canvas.

text

#FAD2E1 - A pale pink that works for very large, decorative headlines, but for body text, consider a dark charcoal like #333333 or deep plum for readability against light backgrounds.

Accessibility notes

  • Ensure sufficient contrast when pairing any of these light colors with white text; most will require dark text for readability.
  • Text set in #FAD2E1 or #FDE2E4 will likely fail WCAG AA contrast for small text against any other palette color; reserve for large decorative elements.
  • Use #E4C1F9 or #F6BDDD for larger text elements if a lighter shade is desired, but always check contrast with the background.
  • For interactive elements, ensure hover states provide a clear visual change, potentially using a slightly darker shade from outside the palette or a subtle animation.

Recommended combinations

Soft Gradient

Ideal for subtle background gradients, header banners, or layered graphic elements that require a smooth, delicate transition.

#FDE2E4 · #FAD2E1 · #F6BDDD

Misty Contrast

Use for UI elements where a gentle yet distinct separation is needed, such as cards, buttons, or informational boxes on a lighter background.

#F6BDDD · #E4C1F9 · #C1F0F7

Dreamy Accents

Excellent for decorative illustrations, infographic highlights, or subtle calls to action, leveraging the cool aqua as a soft focal point.

#FDE2E4 · #C1F0F7 · #E4C1F9

CSS variables

:root {
  --ethereal-bloom-mist-1: #FDE2E4;
  --ethereal-bloom-mist-2: #FAD2E1;
  --ethereal-bloom-mist-3: #F6BDDD;
  --ethereal-bloom-mist-4: #E4C1F9;
  --ethereal-bloom-mist-5: #C1F0F7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ethereal-bloom-mist": {
        1: "#FDE2E4",
        2: "#FAD2E1",
        3: "#F6BDDD",
        4: "#E4C1F9",
        5: "#C1F0F7",
      }
    }
  }
}

Related searches

pastel color schemessoft spring palettedreamy ethereal colorslight blossom huesserene pastel design

Palette colors

Hex values

Color 1#FDE2E4
·
Color 2#FAD2E1
·
Color 3#F6BDDD
·
Color 4#E4C1F9
·
Color 5#C1F0F7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.3:1Fail
1.3:1Fail
1:1Fail
2
1.1:1Fail
1.2:1Fail
1.2:1Fail
1.1:1Fail
3
1.3:1Fail
1.2:1Fail
1:1Fail
1.3:1Fail
4
1.3:1Fail
1.2:1Fail
1:1Fail
1.3:1Fail
5
1:1Fail
1.1:1Fail
1.3:1Fail
1.3:1Fail

Similar palettes

More like Ethereal Bloom Mist

View all pastel
Dreamy Sky Puff
Gossamer Cloud Veil
Aurora Shimmer
Celestial Dream Dust
Cloud Dream Whisper
Cloud Shimmer Dawn