paletta

PALETTE GALLERY

Pastel color palette

Pastel palettes hold hue while dropping saturation and raising lightness, which is why every swatch in this set fails as a standalone text color and needs a dark ink to carry copy. Blossom, lavender, and mint sit at nearly identical lightness so they read as a coordinated set rather than three competing accents.

Updated 2026-07-15
  • BlossomPrimary
    #E893A6
  • LavenderAccent
    #B69AD8
  • MintHighlight
    #7BC2C4
  • ButterSurface
    #FDE9A8
  • Plum InkText
    #4A4453
  • VanillaBackground
    #FFFBF7

Where this palette works

  • Baby, kids, and lifestyle products

    Soft, low-saturation hues are the established convention for products aimed at a gentle, approachable tone.

  • Illustration-heavy marketing pages

    Pastel backgrounds let illustration and photography carry the saturation while the UI chrome stays quiet.

  • Wellness and beauty brands

    Lavender and mint read as calm without the coldness of a pure blue or gray palette.

Accessible pairings

Every pastel swatch here fails AA as a text color on white, which is expected at this lightness. Plum ink is the fix: it clears AAA against vanilla and butter, and still clears AA against mint, so it is the single required text color for the whole palette.

Aa
Plum ink on vanilla
Contrast 9.09 : 1AAA
Aa
Plum ink on butter
Contrast 7.75 : 1AAA
Aa
Plum ink on mint
Contrast 4.61 : 1AA
EXPORT

Use these tokens

Copy as CSS custom properties or a Tailwind v4 @theme block.

:root {
  --palette-primary: #E893A6; /* Blossom */
  --palette-accent: #B69AD8; /* Lavender */
  --palette-highlight: #7BC2C4; /* Mint */
  --palette-surface: #FDE9A8; /* Butter */
  --palette-text: #4A4453; /* Plum Ink */
  --palette-background: #FFFBF7; /* Vanilla */
}

FAQ

Frequently asked questions

Both sit under 2.5:1 contrast against white, far below the 4.5:1 AA floor. Pastels are lightness-heavy by definition, which is what makes them pastel, so they work as backgrounds and accents, not as text.

A single ink tone with enough lightness contrast to clear AA against every pastel in the set. Here that is Plum Ink (#4A4453), which stays legible against all four pastel swatches, not just the lightest one.

Narrow the hue spread. This set uses three hues, pink, violet, teal, rather than the full rainbow pastel set, which keeps the palette identifiable instead of reading as a stock gradient.

Related palettes

Build on this palette

Generate a full shade scale and export to Tailwind, shadcn, or Figma Variables.