Back to palettes

Palette

Gentle Floral Haze

A soft and gentle mix of light blues, delicate pinks, and creamy whites, like the tender petals of baby's breath flowers.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gentle Floral 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 Gentle Floral Haze.

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

Data visualization

#C6E2FF#FFC0CB#F0F8FF#FAEBD7#FFE5B4

Palette guide

How to use Gentle Floral Haze

Overview

The "Gentle Floral Haze" palette offers a tender and romantic blend of soft pastels, reminiscent of delicate baby's breath flowers. It combines the airy light blue of #C6E2FF with the classic pink of #FFC0CB, grounded by the crisp #F0F8FF. Warmth is introduced through the creamy #FAEBD7 and the soft peach of #FFE5B4. Designers can leverage this palette to create dreamy, feminine, and inviting visual experiences. Developers will find these harmonious hues ideal for crafting elegant branding, gentle e-commerce sites, or digital platforms that aim to evoke a sense of calm, beauty, and subtle charm.

Best used for

  • Wedding and event planning services
  • Baby and children's product branding
  • Beauty and skincare websites
  • Floral design and gift shops
  • Feminine lifestyle blogs and content
  • Spa and wellness marketing materials

Suggested color roles

primary

#F0F8FF - A clean, almost pure white, serving as the main background for content, providing an airy foundation.

secondary

#C6E2FF - A soft sky blue, ideal for secondary sections, subtle headers, or card backgrounds, adding a cool touch.

accent

#FFC0CB - A delicate pink, perfect for calls-to-action, important links, or decorative elements, offering a romantic highlight.

background

#F0F8FF - The primary canvas, ensuring a bright, open, and gentle aesthetic.

text

A dark charcoal or deep brown (e.g., #333333 or #4A4A4A) - Essential for ensuring readability against these very light pastel backgrounds.

Accessibility notes

  • Use dark text (e.g., charcoal, deep brown) on all light backgrounds (#C6E2FF, #F0F8FF, #FAEBD7, #FFE5B4) for adequate contrast.
  • Avoid using any of the pastel colors for text on other pastel backgrounds, as contrast will be insufficient.
  • #FFC0CB can be used as an accent, but ensure it meets contrast for interactive states.
  • Ensure visual cues for interactive elements are clear, as color differences are subtle.

Recommended combinations

Dreamy Sky

Create serene and romantic layouts for headers or hero sections, combining cool blues with soft pink.

#F0F8FF · #C6E2FF · #FFC0CB

Warm Bloom

Ideal for inviting content blocks or accents, introducing warmth and a gentle floral feel.

#FAEBD7 · #FFE5B4 · #FFC0CB

Pastel Harmony

Use for subtle color blocking or layered designs, maintaining a light and harmonious balance.

#C6E2FF · #FAEBD7 · #F0F8FF

CSS variables

:root {
  --gentle-floral-haze-1: #C6E2FF;
  --gentle-floral-haze-2: #FFC0CB;
  --gentle-floral-haze-3: #F0F8FF;
  --gentle-floral-haze-4: #FAEBD7;
  --gentle-floral-haze-5: #FFE5B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gentle-floral-haze": {
        1: "#C6E2FF",
        2: "#FFC0CB",
        3: "#F0F8FF",
        4: "#FAEBD7",
        5: "#FFE5B4",
      }
    }
  }
}

Related searches

delicate pastel color palettefloral pink blue schemegentle romantic web designbaby's breath color themesoft feminine UI colors

Palette colors

Hex values

Color 1#C6E2FF
·
Color 2#FFC0CB
·
Color 3#F0F8FF
·
Color 4#FAEBD7
·
Color 5#FFE5B4
·

Accessibility

Contrast checker

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

Similar palettes

More like Gentle Floral Haze

View all pastel