Blue Wonder

A pastel 4-color palette built around Blue Wonder (#424464), Purple Illusion (#b3b9f0), and Foundation White (#eff1ff), with a calm feel throughout.

pastelcalm
Visualize
:root {
  --color-1: #424464;
  --color-2: #787ca8;
  --color-3: #b3b9f0;
  --color-4: #eff1ff;
}

.ASE works in Adobe apps and several others that adopted the format. .sketchpalette imports into Sketch. .swatches (Procreate) follows a community-documented structure, since Procreate doesn't publish an official spec, so treat it as best-effort. .pptx is a real PowerPoint file with the palette applied as the deck's theme colors (not just two sample slides); Keynote opens .pptx files directly too.

Similar palettes

Eucalyptus Wreath41
spage0
Mint Tonic7
Caramelised Pecan3
Rokushō Green58
High Tea19
Indigo Hamlet4
Blithe112

Blue Wonder FAQ

What colors are in Blue Wonder?

Blue Wonder uses 4 colors: Blue Wonder, Minuet Lilac, Purple Illusion, Foundation White.

Is Blue Wonder accessible for text and backgrounds?

The highest-contrast pair in this palette is Blue Wonder on Foundation White, at 8.3:1 (AAA). Use the accessibility panel above to check any specific pair.

How do I use Blue Wonder in a project?

Copy the hex codes above, or open Blue Wonder in the generator to remix it and export as CSS, Tailwind, or JSON.