What are the hex codes in the Lilac & Thistle Echo palette?

The Lilac & Thistle Echo color palette consists of Lilac #C689AA, Mushroom #BBA7A4, Thistle #D2B3D2, Ballet #FFD5DD.

How should I use the Lilac & Thistle Echo palette on a website?

Use Ballet #FFD5DD as the background, Lilac #C689AA for text, Thistle #D2B3D2 for buttons and links, and Mushroom #BBA7A4 for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Lilac & Thistle Echo have enough contrast for text?

The highest-contrast pair is #C689AA on #FFD5DD with a ratio of 2.09:1, which does not meet WCAG AA; add a darker or lighter neutral for body text.

#C689AALilac

#BBA7A4Mushroom

#D2B3D2Thistle

#FFD5DDBallet

Lilac & Thistle Echo color palette

Pastel Muted Romantic

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Lilac	`#C689AA`	`rgb(198, 137, 170)`	`hsl(328, 35%, 66%)`	`oklch(70.1% 0.086 346)`
Mushroom	`#BBA7A4`	`rgb(187, 167, 164)`	`hsl(8, 14%, 69%)`	`oklch(74.5% 0.024 28)`
Thistle	`#D2B3D2`	`rgb(210, 179, 210)`	`hsl(300, 26%, 76%)`	`oklch(80.3% 0.055 326)`
Ballet	`#FFD5DD`	`rgb(255, 213, 221)`	`hsl(349, 100%, 92%)`	`oklch(91.1% 0.048 5)`

Why it works and how to use it

Lilac & Thistle Echo is a pastel light, analogous color palette tagged pastel, muted, romantic. Analogous neighbors on the wheel (Lilac, Thistle, Ballet) give it a natural, low-tension flow. High lightness and gentle saturation put it firmly in pastel territory. The overall temperature is warm.

It works because the lightness steps are gentle (66% to 92%), which keeps the mood consistent from edge to edge. Try it for social media templates and gentle interfaces.

Background: Ballet (#FFD5DD) is the lightest color, so it belongs on large surfaces.
Text: Lilac (#C689AA) on #FFD5DD gives 2.09:1, so pair it with a darker neutral for body copy.
Primary: Thistle (#D2B3D2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Mushroom (#BBA7A4) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

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

BrandFeaturesPricingBlogGet started

Design faster with Lilac & Thistle Echo

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

#C689AA

#BBA7A4

#D2B3D2

#FFD5DD

Color-blind check: under protanopia and deuteranopia and tritanopia, Lilac and Mushroom 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
`#C689AA` on `#FFD5DD`	Aa	2.09:1	Fail
`#BBA7A4` on `#FFD5DD`	Aa	1.72:1	Fail
`#C689AA` on `#D2B3D2`	Aa	1.47:1	Fail
`#D2B3D2` on `#FFD5DD`	Aa	1.42:1	Fail
`#C689AA` on `#BBA7A4`	Aa	1.21:1	Fail
`#BBA7A4` on `#D2B3D2`	Aa	1.21:1	Fail

Similar palettes 24 more in this mood