UI Shades

A study in purple

Thistle

#D8BFD8

Family
Purple
L
0.833
C
0.044
H
326°

Notes

Thistle is the pale, dusty mid-purple-pink of the spiny wildflower's bloom. The CSS hex sits between Lavender and Plum, with low chroma at high lightness. Beauty, wellness, and floral brands use it as a quiet primary or secondary surface, usually under deep purple type or charcoal for a more neutral palette. As a UI element it works as a panel background; against pure white it provides modest separation, so use it with awareness of the layering. Body text contrast against white fails AA at every standard size - strictly a surface tone.

#d8bfd8
Thistle
Thistle
#d8bfd8
oklch(0.833 0.044 325.96)
rgb(216 191 216)
hsl(300 24.3% 79.8%)
Share
#fef8fe
#faf0fa
#f0dff0
#d8bfd8
#c6a9c6
#9d809d
#846884
#6e546e
#503c50
#372737
#1d131d

See your palette on a real UI - coming soon

Preview these shades across buttons, cards, and components in a live interface.

Plate 02

Palette built around Thistle

Cross-reference
Q&A

Frequently asked questions

What is Thistle?

Thistle is the pale, dusty mid-purple-pink of the spiny wildflower's bloom. The CSS hex sits between Lavender and Plum, with low chroma at high lightness. Its hex code is #D8BFD8.

What are the tints and shades of Thistle?

uishades builds an 11-step OKLCH ramp for Thistle (#D8BFD8) - its lightest tints through its darkest shades - plus an 11-stop Tailwind scale (50–950), both keyed to the same 50–950 stops. Lightness steps stay evenly spaced and the hue stays stable, so the mid-tones don't go muddy.

What colors pair well with Thistle?

Its complementary color is #B7D1B8. Triadic partners are #D5C7A9 and #A8D1D6; analogous neighbours are #E1BDC9 and #CAC3E2.

What are the OKLCH and RGB values of Thistle?

Thistle is #D8BFD8 - OKLCH 0.833 0.044 326°, rgb(216 191 216), in the purple family.