Palette

Cloudy Rose Serene

A delicate and calming blend of muted tones, like a soft, cloudy sky at dusk with a hint of rose.

PastelCalm5 colors

More Pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cloudy Rose Serene 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 Cloudy Rose Serene.

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

Data visualization

#EFEBE9#D7CCC8#BCAAA4#F8BBD0#EF9A9A

Palette guide

How to use Cloudy Rose Serene

Overview

The Cloudy Rose Serene palette is a delicate and calming blend of muted tones, reminiscent of a soft, cloudy sky at dusk with a hint of rose. This pastel collection features the gentle off-whites #EFEBE9 and #D7CCC8, complemented by the subtle pinks of #F8BBD0 and #EF9A9A, and grounded by the warm grey-beige of #BCAAA4. Designers can leverage these hex codes for ethereal branding, soothing digital experiences, or charming print materials. Developers will find them suitable for creating user interfaces that feel soft, inviting, and peaceful, ideal for a feminine or gentle aesthetic.

Best used for

wedding and event planning
baby and children's brands
beauty and cosmetic websites
feminine blogs and portfolios
interior design (soft themes)
gentle product packaging

Suggested color roles

primary

#EF9A9A - A soft, muted rose pink, serving as a gentle yet distinct primary for accents or key graphic elements.

secondary

#F8BBD0 - A very light, delicate pink, perfect for subheadings, background panels, or supportive graphics.

accent

#BCAAA4 - A warm, muted grey-beige, providing a grounding and sophisticated contrast for subtle accents or important details.

background

#EFEBE9 - The lightest off-white, offering a pristine, soft, and expansive canvas.

text

A dark charcoal grey or deep plum for optimal readability, as the palette's colors are generally too light for body text.

Accessibility notes

All colors are very light; use a very dark text color (e.g., black or dark charcoal) for any body text.
Avoid using any palette colors for text against other palette colors, except possibly #EF9A9A on #EFEBE9 for very large headings.
Ensure interactive elements have clear visual feedback beyond just color, as contrast within the palette is low.
Rely on size, placement, and iconography to convey meaning, as subtle color differences may not be sufficient for all users.

Recommended combinations

Rose Haze

For creating soft, layered backgrounds or subtle dividers in a tranquil and feminine interface.

#EFEBE9 · #D7CCC8 · #F8BBD0

Gentle Blush

To introduce a touch of rose with a grounding neutral, suitable for highlights or decorative elements.

#EF9A9A · #BCAAA4 · #EFEBE9

Muted Elegance

Ideal for content blocks or feature cards, maintaining a soft and harmonious visual flow with subtle differentiation.

#D7CCC8 · #BCAAA4 · #F8BBD0

CSS variables

:root {
  --cloudy-rose-serene-1: #EFEBE9;
  --cloudy-rose-serene-2: #D7CCC8;
  --cloudy-rose-serene-3: #BCAAA4;
  --cloudy-rose-serene-4: #F8BBD0;
  --cloudy-rose-serene-5: #EF9A9A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cloudy-rose-serene": {
        1: "#EFEBE9",
        2: "#D7CCC8",
        3: "#BCAAA4",
        4: "#F8BBD0",
        5: "#EF9A9A",
      }
    }
  }
}

Hex values

Color 1#EFEBE9

Color 2#D7CCC8

Color 3#BCAAA4

Color 4#F8BBD0

Color 5#EF9A9A

Accessibility

Contrast checker

1.3:1Fail

1.9:1Fail

1.4:1Fail

1.8:1Fail

1.3:1Fail

1.4:1Fail

1:1Fail

1.4:1Fail

1.9:1Fail

1.4:1Fail

1:1Fail

1.4:1Fail

1:1Fail

1.4:1Fail

1.3:1Fail

1.8:1Fail

1.4:1Fail

1:1Fail

1.3:1Fail

Similar palettes

More like Cloudy Rose Serene

Cloudy Rose Serene

See it in context.

Ready when you are.

Built with Cloudy Rose Serene.

How to use Cloudy Rose Serene

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Rose Haze

Gentle Blush

Muted Elegance

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Cloudy Rose Serene