Back to palettes

Palette

Patisserie Treat Pastel

A delightful array of soft, sugary hues inspired by a charming French patisserie.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Patisserie Treat Pastel 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 Patisserie Treat Pastel.

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

Data visualization

#FFDAB9#FFC0CB#E6E6FA#B0E0E6#ADD8E6

Palette guide

How to use Patisserie Treat Pastel

Overview

The Patisserie Treat Pastel palette is a delightful array of soft, sugary hues, perfect for creating inviting and gentle digital experiences. Featuring the warm peach of #FFDAB9, the classic light pink of #FFC0CB, and the serene lavender of #E6E6FA, this collection exudes a sense of playful charm. Developers can leverage these colors for interfaces that require a light, airy touch, such as lifestyle blogs, children's apps, or creative e-commerce sites. The cool aqua of #B0E0E6 and #ADD8E6 provide a refreshing balance, ensuring a versatile range for conveying sweetness, softness, and an overall cheerful mood in digital spaces.

Best used for

  • Baby product branding and websites
  • Dessert and sweet shop branding
  • Children's educational apps
  • Craft and hobby blogs
  • Spring-themed digital campaigns
  • Gentle lifestyle content creation

Suggested color roles

primary

A warm, creamy peach that serves as a welcoming and gentle primary color for backgrounds or large sections: #FFDAB9.

secondary

A classic, soft pink, excellent for headers, secondary content blocks, or subtle branding: #FFC0CB.

accent

A calming aqua blue, ideal for interactive elements, highlights, or a refreshing pop of color: #B0E0E6.

background

A very light, almost white lavender that provides a clean, soft, and slightly cool canvas: #E6E6FA.

text

A deep, readable dark navy (e.g., #2C3E50) offers excellent contrast against these light pastels.

Accessibility notes

  • Text should be dark (e.g., black, dark grey, or dark navy) for readability against any of these light background colors.
  • Avoid using light text on any of these pastels, as contrast will be insufficient.
  • Ensure interactive elements have sufficient contrast with their surrounding background when in focus or hover states.
  • The similar lightness of #B0E0E6 and #ADD8E6 means they should not be used for text-background pairs.

Recommended combinations

Sweet Core

A balanced trio for main content, backgrounds, and a gentle, inviting aesthetic.

#FFDAB9 · #FFC0CB · #E6E6FA

Refreshing Pop

Use for dynamic elements, infographics, or sections needing a burst of fresh, cool energy.

#B0E0E6 · #ADD8E6 · #FFC0CB

Gentle Contrast

Ideal for creating soft visual separation in layouts or for subtle background textures.

#E6E6FA · #FFDAB9 · #B0E0E6

CSS variables

:root {
  --patisserie-treat-pastel-1: #FFDAB9;
  --patisserie-treat-pastel-2: #FFC0CB;
  --patisserie-treat-pastel-3: #E6E6FA;
  --patisserie-treat-pastel-4: #B0E0E6;
  --patisserie-treat-pastel-5: #ADD8E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "patisserie-treat-pastel": {
        1: "#FFDAB9",
        2: "#FFC0CB",
        3: "#E6E6FA",
        4: "#B0E0E6",
        5: "#ADD8E6",
      }
    }
  }
}

Related searches

pastel sweet treat palettesoft pink and blue UIdelicate dessert colorslight and inviting web designcharming baby brand colors

Palette colors

Hex values

Color 1#FFDAB9
·
Color 2#FFC0CB
·
Color 3#E6E6FA
·
Color 4#B0E0E6
·
Color 5#ADD8E6
·

Accessibility

Contrast checker

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

Similar palettes

More like Patisserie Treat Pastel

View all pastel