Back to palettes

Palette

Parisian Macaron Display

A delicate assortment of macarons, evoking the sweet elegance and charm of a Parisian bakery.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Parisian Macaron Display 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 Parisian Macaron Display.

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

Data visualization

#98FB98#F08080#FFFFC2#ADD8E6#F8F8F8

Palette guide

How to use Parisian Macaron Display

Overview

The Parisian Macaron Display palette is a vibrant, cheerful collection, capturing the delightful array of colors found in a French bakery. It features a lively mint green #98FB98, a charming coral red #F08080, a sunny yellow #FFFFC2, a soft sky blue #ADD8E6, and a crisp off-white #F8F8F8. This palette is perfect for designers aiming to create playful, inviting, and visually stimulating projects. Developers can leverage these specific hex codes to build engaging user interfaces for confectionery, children's brands, or celebratory events, ensuring a consistent visual language that conveys joy and sweetness across digital platforms. It's an ideal choice for a fresh, appealing digital presence.

Best used for

  • Confectionery branding
  • Children's book illustrations
  • Event planning websites
  • Creative agency portfolios
  • Food blogger websites
  • Playful app interfaces

Suggested color roles

primary

Use #F08080 as a cheerful, inviting primary color for calls to action or key headings.

secondary

Apply #98FB98 for refreshing accents, supporting graphics, or secondary informational blocks.

accent

Utilize #FFFFC2 for bright highlights, icons, or to add a touch of sunny optimism.

background

Employ #F8F8F8 as the main clean, neutral background, providing excellent contrast for colors.

text

Opt for a dark grey or black (e.g., #333333) for primary text to ensure optimal readability on these vibrant backgrounds.

Accessibility notes

  • Ensure dark text (e.g., black or dark gray) is used on #98FB98, #FFFFC2, #ADD8E6, and #F8F8F8 for readability.
  • The bright #FFFFC2 should not be used for critical text unless contrast with its background is strictly verified.
  • Text in #F08080 on #F8F8F8 offers good readability for headlines, but check for smaller body text.
  • Avoid pairing similar lightness values (e.g., #98FB98 text on #ADD8E6 background) for crucial information.

Recommended combinations

Cheerful Contrast

High-contrast for text and background, with a vibrant red for calls to action and green for accents.

#F8F8F8 · #F08080 · #98FB98

Sweet Harmony

A soft, inviting blend for backgrounds or subtle design elements, evoking a gentle playfulness.

#ADD8E6 · #FFFFC2 · #F8F8F8

Vibrant Mix

Excellent for creating dynamic sections, banners, or visual elements that need to pop with color.

#F08080 · #98FB98 · #ADD8E6

CSS variables

:root {
  --parisian-macaron-display-1: #98FB98;
  --parisian-macaron-display-2: #F08080;
  --parisian-macaron-display-3: #FFFFC2;
  --parisian-macaron-display-4: #ADD8E6;
  --parisian-macaron-display-5: #F8F8F8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "parisian-macaron-display": {
        1: "#98FB98",
        2: "#F08080",
        3: "#FFFFC2",
        4: "#ADD8E6",
        5: "#F8F8F8",
      }
    }
  }
}

Related searches

macaron color schemeplayful pastel palettesweet dessert colorscheerful bakery brandingvibrant light colors

Palette colors

Hex values

Color 1#98FB98
·
Color 2#F08080
·
Color 3#FFFFC2
·
Color 4#ADD8E6
·
Color 5#F8F8F8
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
1.2:1Fail
1.2:1Fail
1.2:1Fail
2
2:1Fail
2.5:1Fail
1.7:1Fail
2.4:1Fail
3
1.2:1Fail
2.5:1Fail
1.5:1Fail
1:1Fail
4
1.2:1Fail
1.7:1Fail
1.5:1Fail
1.4:1Fail
5
1.2:1Fail
2.4:1Fail
1:1Fail
1.4:1Fail

Similar palettes

More like Parisian Macaron Display

View all pastel