What are the hex codes in the Slate Blue & Lilac Haze palette?

The Slate Blue & Lilac Haze color palette consists of Space #412861, Slate Blue #7C56AF, Lilac #C188BE, Petal #F7E8F0.

How should I use the Slate Blue & Lilac Haze palette on a website?

Use Petal #F7E8F0 as the background, Space #412861 for text, Slate Blue #7C56AF for buttons and links, and Lilac #C188BE for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Petal at 10.44:1.

Which colors in Slate Blue & Lilac Haze have enough contrast for text?

The highest-contrast pair is #412861 on #F7E8F0 with a ratio of 10.44:1, which passes WCAG AA for normal text.

#412861Space

#7C56AFSlate Blue

#C188BELilac

#F7E8F0Petal

Slate Blue & Lilac Haze color palette

Cold Purple White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Space	`#412861`	`rgb(65, 40, 97)`	`hsl(266, 42%, 27%)`	`oklch(33.8% 0.098 302)`
Slate Blue	`#7C56AF`	`rgb(124, 86, 175)`	`hsl(266, 36%, 51%)`	`oklch(53.4% 0.138 302)`
Lilac	`#C188BE`	`rgb(193, 136, 190)`	`hsl(303, 31%, 65%)`	`oklch(70.1% 0.100 328)`
Petal	`#F7E8F0`	`rgb(247, 232, 240)`	`hsl(328, 48%, 94%)`	`oklch(94.5% 0.019 344)`

Why it works and how to use it

Slate Blue & Lilac Haze is an analogous color palette tagged cold, purple, white. Analogous neighbors on the wheel (Space, Slate Blue, Lilac) give it a natural, low-tension flow. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Slate Blue takes the lead while the rest support. Lightness runs from 27% to 94%. Well suited to websites, presentations and branding.

Background: Petal (#F7E8F0) is the lightest color, so it belongs on large surfaces.
Text: Space (#412861) on #F7E8F0 gives 10.44:1, passing WCAG AAA.
Primary: Slate Blue (#7C56AF) is the most saturated mid-tone; use it for buttons and links (4.66:1 against the background, fine for UI elements).
Accent: Lilac (#C188BE) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Petal at 10.44:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Slate Blue & Lilac Haze

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

#412861

#7C56AF

#C188BE

#F7E8F0

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
`#412861` on `#F7E8F0`	Aa	10.44:1	AAA
`#7C56AF` on `#F7E8F0`	Aa	4.66:1	AA
`#412861` on `#C188BE`	Aa	4.43:1	AA large only
`#C188BE` on `#F7E8F0`	Aa	2.36:1	Fail
`#412861` on `#7C56AF`	Aa	2.24:1	Fail
`#7C56AF` on `#C188BE`	Aa	1.98:1	Fail

Similar palettes 24 more in this mood