What are the hex codes in the Lavender Cream palette?

The Lavender Cream color palette consists of Smoke #F6F1FF, Periwinkle #D8CCF5, Wisteria #B4A2E8, Charcoal #3E3560.

How should I use the Lavender Cream palette on a website?

Use Smoke #F6F1FF as the background, Charcoal #3E3560 for text, Periwinkle #D8CCF5 for buttons and links, and Wisteria #B4A2E8 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Charcoal at 10.06:1.

Which colors in Lavender Cream have enough contrast for text?

The highest-contrast pair is #F6F1FF on #3E3560 with a ratio of 10.06:1, which passes WCAG AA for normal text.

#F6F1FFSmoke

#D8CCF5Periwinkle

#B4A2E8Wisteria

#3E3560Charcoal

Lavender Cream color palette

Cold White Purple

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Smoke	`#F6F1FF`	`rgb(246, 241, 255)`	`hsl(261, 100%, 97%)`	`oklch(96.6% 0.019 302)`
Periwinkle	`#D8CCF5`	`rgb(216, 204, 245)`	`hsl(258, 67%, 88%)`	`oklch(86.8% 0.057 299)`
Wisteria	`#B4A2E8`	`rgb(180, 162, 232)`	`hsl(255, 60%, 77%)`	`oklch(75.3% 0.101 296)`
Charcoal	`#3E3560`	`rgb(62, 53, 96)`	`hsl(253, 29%, 29%)`	`oklch(35.9% 0.073 292)`

Why it works and how to use it

Lavender Cream is a vivid light, monochromatic color palette tagged cold, white, purple. All four colors sit within 5° of hue, so the scheme reads as one color explored across light and dark. These are bold, punchy colors that need generous white space around them. The overall temperature is cool.

With 3 chromatic colors, Periwinkle takes the lead while the rest support. Lightness runs from 29% to 97%. Well suited to websites, presentations and branding.

Background: Smoke (#F6F1FF) is the lightest color, so it belongs on large surfaces.
Text: Charcoal (#3E3560) on #F6F1FF gives 10.06:1, passing WCAG AAA.
Primary: Periwinkle (#D8CCF5) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Wisteria (#B4A2E8) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Charcoal at 10.06:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Lavender Cream

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

#F6F1FF

#D8CCF5

#B4A2E8

#3E3560

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#F6F1FF` on `#3E3560`	Aa	10.06:1	AAA
`#D8CCF5` on `#3E3560`	Aa	7.37:1	AAA
`#B4A2E8` on `#3E3560`	Aa	4.93:1	AA
`#F6F1FF` on `#B4A2E8`	Aa	2.04:1	Fail
`#D8CCF5` on `#B4A2E8`	Aa	1.5:1	Fail
`#F6F1FF` on `#D8CCF5`	Aa	1.37:1	Fail

Similar palettes 24 more in this mood