Back to palettes

Palette

Sweet Tart Dream

A delightful array of soft, sugary pastels, reminiscent of cheerful candy tarts and whimsical childhood treats.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sweet Tart Dream 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 Sweet Tart Dream.

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

Data visualization

#FFC0CB#FFDAB9#FFFFE0#ADD8E6#E0BBE4

Palette guide

How to use Sweet Tart Dream

Overview

The Sweet Tart Dream palette is a delightful collection of soft, sugary pastels, perfect for designs aiming for a whimsical, playful, or comforting mood. Featuring gentle shades like #FFC0CB (Pink), #FFDAB9 (Peach), #FFFFE0 (Light Yellow), #ADD8E6 (Light Blue), and #E0BBE4 (Lavender), this palette evokes childhood treats and lighthearted charm. Designers can leverage its inviting nature for branding, UI elements, or illustrations, creating experiences that feel approachable and sweet. Its delicate balance allows for versatile application, from subtle backgrounds to cheerful accents, making it ideal for projects needing a touch of innocent joy.

Best used for

  • Children's product branding or packaging
  • Dessert or bakery shop branding and websites
  • Feminine fashion or beauty product designs
  • Playful mobile application interfaces
  • Event invitations for baby showers or birthdays
  • Whimsical digital illustrations and animations

Suggested color roles

primary

Use #E0BBE4 (Lavender) as a calming and inviting base, ideal for larger UI sections, main brand identity elements, or significant design blocks, offering a gentle yet distinct presence.

secondary

Apply #FFC0CB (Pink) to add warmth and a touch of sweetness, perfect for complementary blocks, subheadings, or secondary calls to action, creating visual interest.

accent

Utilize #ADD8E6 (Light Blue) to provide a cool, fresh pop of color, excellent for interactive elements, highlights, or small illustrative details to subtly draw attention without being overwhelming.

background

Employ #FFFFE0 (Light Yellow) as an exceptionally light and airy canvas, best used for main page backgrounds to ensure spaciousness and allow other colors to softly shine through.

text

Given the light nature of the palette, use a dark neutral like #333333 (charcoal) or #000000 (black) for body text and headings to ensure maximum readability against any background color.

Accessibility notes

  • Ensure sufficient contrast when pairing any two pastel colors for text or crucial UI elements; most will fail WCAG AA for small text.
  • Always test text readability, especially when using lighter palette colors on #FFFFE0; darker neutrals are generally required for body text.
  • Use strong visual cues beyond color alone for interactive elements, as low contrast between pastels can hinder perception.
  • For larger text (18pt or 14pt bold and above), some pastel pairings might pass WCAG AA, but verify with a contrast checker.

Recommended combinations

Playful Header

Use #E0BBE4 as a header background, #FFC0CB for a sub-headline or decorative element, and #ADD8E6 for a small icon or accent within the header.

#E0BBE4 · #FFC0CB · #ADD8E6

Soft UI Card

Apply #FFFFE0 as the card background, #FFDAB9 for subtle borders or separators, and #E0BBE4 for interactive elements like buttons or tags.

#FFFFE0 · #FFDAB9 · #E0BBE4

Whimsical Graphic

Combine these three for illustrative elements, using #FFC0CB and #ADD8E6 as main shapes and #FFDAB9 for subtle details, highlights, or decorative patterns.

#FFC0CB · #ADD8E6 · #FFDAB9

CSS variables

:root {
  --sweet-tart-dream-1: #FFC0CB;
  --sweet-tart-dream-2: #FFDAB9;
  --sweet-tart-dream-3: #FFFFE0;
  --sweet-tart-dream-4: #ADD8E6;
  --sweet-tart-dream-5: #E0BBE4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sweet-tart-dream": {
        1: "#FFC0CB",
        2: "#FFDAB9",
        3: "#FFFFE0",
        4: "#ADD8E6",
        5: "#E0BBE4",
      }
    }
  }
}

Related searches

pastel color palettesweet tart colorsplayful design palettelight whimsical colorssoft candy colors

Palette colors

Hex values

Color 1#FFC0CB
·
Color 2#FFDAB9
·
Color 3#FFFFE0
·
Color 4#ADD8E6
·
Color 5#E0BBE4
·

Accessibility

Contrast checker

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

Similar palettes

More like Sweet Tart Dream

View all pastel
Confetti Cream Delight
Creamery Soft Serve
Macaroon Glaze Delight
Pastel Macaron Swirl
Pastel Macaron Tower
Pastel Macaroon Stack