Pastel Dream — 5-color palette
#FFD6E0#C7CEEA#B5EAD7#FFDAC1#E2F0CBHex codes
Hex
#FFD6E0
RGB
255, 214, 224
HSL
345°, 100%, 92%
Hex
#C7CEEA
RGB
199, 206, 234
HSL
228°, 45%, 85%
Hex
#B5EAD7
RGB
181, 234, 215
HSL
158°, 56%, 81%
Hex
#FFDAC1
RGB
255, 218, 193
HSL
24°, 100%, 88%
Hex
#E2F0CB
RGB
226, 240, 203
HSL
83°, 55%, 87%
How to use this palette
The first color in Pastel Dream is the dominant tone — use it for primary surfaces and backgrounds. The middle three are the supporting palette: one warm, one cool, one neutral. The last is the accent — reserve it for highlights, calls-to-action, and emphasis.
For web projects, copy the CSS variables below. For print or illustration, use the hex codes directly. If you’re designing for accessibility, check the contrast between the text and background colors before you ship.
CSS
:root {
--pastel-dream-1: #FFD6E0;
--pastel-dream-2: #C7CEEA;
--pastel-dream-3: #B5EAD7;
--pastel-dream-4: #FFDAC1;
--pastel-dream-5: #E2F0CB;
}