Palette

Chill Breeze Blossom

A soft and serene palette, capturing the delicate beauty of a frosty morning with subtle, cool tones, quiet and calm.

pastelcalm5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Chill Breeze Blossom 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 Chill Breeze Blossom.

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

Data visualization

#B0E0E6#FFDAB9#F8F8F8#E6E6FA#D3D3D3

Palette guide

How to use Chill Breeze Blossom

Overview

The Chill Breeze Blossom palette is a soft and serene collection, capturing the delicate beauty of a frosty morning with subtle, cool tones. It features the calming #B0E0E6 (Powder Blue) and the gentle #E6E6FA (Lavender Blush), balanced by the warm hint of #FFDAB9 (Peach Puff). The palette is grounded by neutral tones like #F8F8F8 (White Smoke) and #D3D3D3 (Light Grey), creating a quiet and calm aesthetic. This collection is ideal for designers seeking to convey tranquility, purity, or a refreshing coolness. It's particularly effective for wellness brands, winter-themed designs, or any project that benefits from a peaceful and understated elegance.

Best used for

Wellness and meditation app interfaces
Winter-themed event promotions
Spa and beauty product branding
Minimalist interior design concepts
Serene lifestyle blogs
Delicate fashion accessories

Suggested color roles

primary

Utilize #B0E0E6 (Powder Blue) for main background areas or large content blocks to establish a cool, calming atmosphere.

secondary

Apply #E6E6FA (Lavender Blush) for subheadings, subtle UI elements, or to add a hint of softness.

accent

Employ #FFDAB9 (Peach Puff) for delicate highlights, call-to-action buttons, or to introduce a touch of warmth.

background

Use #F8F8F8 (White Smoke) as a clean, airy base that ensures good readability for darker text.

text

A dark grey or charcoal (#333333) is recommended for body text to ensure optimal readability against these light, cool tones.

Accessibility notes

Ensure sufficient contrast when pairing text with #F8F8F8; use dark grey or black for readability.
Avoid using light pastel colors for text, as they will have insufficient contrast against similar light backgrounds.
Check contrast ratios for interactive elements, ensuring they are clearly distinguishable.
For smaller text, use a strong contrasting color to maintain legibility against #B0E0E6 and #E6E6FA.

Recommended combinations

Cool Serenity

Ideal for soft backgrounds, headers, or any design needing a calm and refreshing feel.

#F8F8F8 · #B0E0E6 · #E6E6FA

Warm Balance

Use #B0E0E6 as a primary, #FFDAB9 for a warm accent, and #D3D3D3 for supporting elements.

#B0E0E6 · #FFDAB9 · #D3D3D3

Gentle Contrast

Combine for layered backgrounds, subtle patterns, or to add depth to minimalist layouts.

#E6E6FA · #D3D3D3 · #F8F8F8

CSS variables

:root {
  --chill-breeze-blossom-1: #B0E0E6;
  --chill-breeze-blossom-2: #FFDAB9;
  --chill-breeze-blossom-3: #F8F8F8;
  --chill-breeze-blossom-4: #E6E6FA;
  --chill-breeze-blossom-5: #D3D3D3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "chill-breeze-blossom": {
        1: "#B0E0E6",
        2: "#FFDAB9",
        3: "#F8F8F8",
        4: "#E6E6FA",
        5: "#D3D3D3",
      }
    }
  }
}

Hex values

Color 1#B0E0E6

Color 2#FFDAB9

Color 3#F8F8F8

Color 4#E6E6FA

Color 5#D3D3D3

Accessibility

Contrast checker

1.1:1Fail

1.3:1Fail

1.2:1Fail

1:1Fail

1.1:1Fail

1.2:1Fail

1.1:1Fail

1.3:1Fail

1.2:1Fail

1.4:1Fail

1.2:1Fail

1.1:1Fail

1.2:1Fail

1:1Fail

1.1:1Fail

1.4:1Fail

1.2:1Fail

Similar palettes

More like Chill Breeze Blossom

Chill Breeze Blossom

See it in context.

Ready when you are.

Built with Chill Breeze Blossom.

How to use Chill Breeze Blossom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Cool Serenity

Warm Balance

Gentle Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Chill Breeze Blossom