What are the hex codes in the Vanilla & Cream Mist palette?

The Vanilla & Cream Mist color palette consists of Cream #ECFCD0, Vanilla #DCF299, Periwinkle #D0DAFF, Dusk #4D4969.

How should I use the Vanilla & Cream Mist palette on a website?

Use Cream #ECFCD0 as the background, Dusk #4D4969 for text, Periwinkle #D0DAFF for buttons and links, and Vanilla #DCF299 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Cream on Dusk at 7.85:1.

Which colors in Vanilla & Cream Mist have enough contrast for text?

The highest-contrast pair is #ECFCD0 on #4D4969 with a ratio of 7.85:1, which passes WCAG AA for normal text.

#ECFCD0Cream

#DCF299Vanilla

#D0DAFFPeriwinkle

#4D4969Dusk

Vanilla & Cream Mist color palette

Modern Cold Minimal Beige

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Cream	`#ECFCD0`	`rgb(236, 252, 208)`	`hsl(82, 88%, 90%)`	`oklch(96.8% 0.060 124)`
Vanilla	`#DCF299`	`rgb(220, 242, 153)`	`hsl(75, 77%, 77%)`	`oklch(92.5% 0.115 120)`
Periwinkle	`#D0DAFF`	`rgb(208, 218, 255)`	`hsl(227, 100%, 91%)`	`oklch(89.3% 0.052 273)`
Dusk	`#4D4969`	`rgb(77, 73, 105)`	`hsl(248, 18%, 35%)`	`oklch(42.3% 0.053 290)`

Why it works and how to use it

Vanilla & Cream Mist is a vivid light, complementary color palette tagged modern, cold, minimal. Cream and Dusk sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. These are bold, punchy colors that need generous white space around them. The overall temperature is cool.

The palette holds together thanks to its complementary hue relationship and a strong light-to-dark ladder (91% down to 35% lightness). A natural fit for websites, presentations and branding.

Background: Cream (#ECFCD0) is the lightest color, so it belongs on large surfaces.
Text: Dusk (#4D4969) on #ECFCD0 gives 7.85:1, passing WCAG AAA.
Primary: Periwinkle (#D0DAFF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Vanilla (#DCF299) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Cream on Dusk at 7.85:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Vanilla & Cream Mist

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#ECFCD0

#DCF299

#D0DAFF

#4D4969

Color-blind check: under tritanopia, Vanilla and Periwinkle become hard to tell apart, so do not rely on that pair alone to carry meaning.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#ECFCD0` on `#4D4969`	Aa	7.85:1	AAA
`#DCF299` on `#4D4969`	Aa	6.96:1	AA
`#D0DAFF` on `#4D4969`	Aa	6.13:1	AA
`#ECFCD0` on `#D0DAFF`	Aa	1.28:1	Fail
`#DCF299` on `#D0DAFF`	Aa	1.14:1	Fail
`#ECFCD0` on `#DCF299`	Aa	1.13:1	Fail

Similar palettes 24 more in this mood