CSS named colour

Thistle

#d8bfd8

A CSS named colour: thistle is valid anywhere a colour is expected.

RGB: rgb(216 191 216)
HSL: 300°, 24%, 80%
OKLCh: 83.3% 0.044 326.0

Thistle in every format

Web & CSSThe everyday formats for stylesheets and design tools.

Hex	`#d8bfd8`
RGB	`rgb(216 191 216)`
RGB legacy	`rgb(216, 191, 216)`
RGB percent	`rgb(84.71% 74.9% 84.71%)`
HSL	`hsl(300 24.3% 79.8%)`
HSL legacy	`hsl(300, 24.3%, 79.8%)`
HSV / HSB	`hsv(300, 11.6%, 84.7%)`
HWB	`hwb(300 74.9% 15.3%)`
Nearest name	`thistle`
CMYK	`cmyk(0%, 11.6%, 0%, 15.3%)`Naive conversion. Real print work needs an ICC profile.

Perceptual & wide gamutModern CSS colour spaces for uniform scales and P3 displays.

OKLCh	`oklch(83.329% 0.04391 325.963)`Modern CSS colour space for even palettes — better than HSL when building scales.
OKLab	`oklab(83.329% 0.03639 -0.02458)`
CIE LCh	`lch(80.062% 15.41 323.63)`
CIE Lab	`lab(80.062% 12.409 -9.138)`
Display P3	`color(display-p3 0.8308 0.7525 0.8405)`
Rec. 2020	`color(rec2020 0.795 0.7298 0.82)`
srgb-linear	`color(srgb-linear 0.6867 0.521 0.6867)`Light-linear sRGB — the same numbers a shader wants for maths.
CIE XYZ (D65)	`color(xyz-d65 0.5934 0.5682 0.7281)`

ShadersGLSL, HLSL and WGSL vectors in both encoded and linear form.

GLSL vec3 — sRGB	`vec3(0.847, 0.749, 0.847)`Encoded values. Use when writing straight to the framebuffer.
GLSL vec3 — linear	`vec3(0.687, 0.521, 0.687)`Light-linear values. Use for lighting, blending and mixing.
GLSL vec4 — sRGB	`vec4(0.847, 0.749, 0.847, 1.0)`
GLSL vec4 — linear	`vec4(0.687, 0.521, 0.687, 1.0)`
GLSL ivec3	`ivec3(216, 191, 216)`
HLSL float3 — sRGB	`float3(0.847, 0.749, 0.847)`
HLSL float3 — linear	`float3(0.687, 0.521, 0.687)`
HLSL float4 — sRGB	`float4(0.847, 0.749, 0.847, 1.0)`
HLSL half4 — sRGB	`half4(0.847, 0.749, 0.847, 1.0)`
WGSL vec3f — sRGB	`vec3f(0.847, 0.749, 0.847)`
WGSL vec4f — sRGB	`vec4f(0.847, 0.749, 0.847, 1.0)`
WGSL vec3<f32> — linear	`vec3<f32>(0.687, 0.521, 0.687)`

Engines & appsConstructors for Unity, Unreal, Godot, Flutter, SwiftUI and Android.

Unity Color	`new Color(0.847f, 0.749f, 0.847f, 1.0f)`Color for everyday scripting (0–1). Color32 when you need whole numbers from 0 to 255.
Unity Color32	`new Color32(216, 191, 216, 255)`
Unreal FLinearColor	`FLinearColor(0.6867f, 0.521f, 0.6867f, 1.0f)`FLinearColor for materials and lighting. FColor when you need whole numbers from 0 to 255.
Unreal FColor	`FColor(216, 191, 216, 255)`Whole numbers from 0 to 255 — use when an API asks for FColor, not FLinearColor.
Godot Color	`Color(0.847, 0.749, 0.847, 1)`
Flutter Color	`Color(0xFFD8BFD8)`Packed ARGB, so alpha comes first.
Android Color	`Color.rgb(216, 191, 216)`
SwiftUI Color	`Color(red: 0.847, green: 0.749, blue: 0.847)`
UIKit UIColor	`UIColor(red: 0.847, green: 0.749, blue: 0.847, alpha: 1)`

Raw valuesPacked integers and plain arrays.

0x hex	`0xD8BFD8`
0x hex (ARGB)	`0xFFD8BFD8`
Array 0–1	`[0.847, 0.749, 0.847]`
Array 0–255	`[216, 191, 216]`
Decimal integer	`14204888`

Contrast and accessibility

WCAG 2 ratios are what audits and legislation reference. APCA is shown alongside because WCAG 2 is known to misjudge mid-tone backgrounds, and it is the basis of the WCAG 3 draft.

Pairing	WCAG 2 ratio	Level	APCA	Suitable for
Thistle on white	1.70:1	Fail	Lc 30	Non-text elements only
Thistle on black	12.36:1	AAA	Lc 72	Headings and large text

Thistle text on a white background

Thistle text on a black background

White text on Thistle

Black text on Thistle

Tonal scale

Hue held fixed while lightness walks OKLCh, ready to use as a design system ramp.

50#fff0ff
100#fae6fa
200#ead4ea
300#d4bdd4
400#b8a0b8
500#9a829a
600#7f697f
700#675367
800#534153
900#423242
950#271a27

Tints and shades

Mixed perceptually toward white and black, so the steps feel evenly spaced.

Tint 1#dfc9de
Tint 2#e5d4e5
Tint 3#ecdfeb
Tint 4#f2e9f2
Tint 5#f9f4f8
Shade 1#a995a9
Shade 2#7d6d7d
Shade 3#534853
Shade 4#2c262c
Shade 5#0a080a

Colours that work with Thistle

Complementary, triadic and analogous partners, rotated in OKLCh so they keep the same apparent brightness.

#b7d1b8
#d5c7a9
#a8d1d6
#cac3e2
#e1bdc9

Closest CSS names

thistleexact match
silverΔEok 0.051
lightsteelblueΔEok 0.054
lightgrayΔEok 0.055
pinkΔEok 0.060
lightpinkΔEok 0.063