Named color · #D4C0DF
Purple Whisper
Purple Whisper is #D4C0DF: rgb(212 192 223), hsl(279 33% 81%), oklch(0.834 0.048 313.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Purple Whisper color name →
#D4C0DF
oklch(0.834 0.048 313.7)
Color conversions
- HEX
- #d4c0df
- RGB
- rgb(212 192 223)
- HSL
- hsl(279 33% 81%)
- HWB
- hwb(279 75% 13%)
- OKLCH
- oklch(0.834 0.048 313.7)
- OKLab
- oklab(0.834 0.033 -0.035)
- CIE Lab
- lab(80.13 11.49 -12.83)
- LCH
- lch(80.13 17.22 311.8)
- CMYK
- cmyk(5% 14% 0% 13%)
Tints · Shades · Tones
Tints
- D8C6E2
- DDCCE5
- E1D3E9
- E5D9EC
- E9DFEF
- EEE6F2
- F2ECF5
- F6F2F9
- FBF9FC
Shades
- B8A7C2
- 9D8EA5
- 83768A
- 695F6F
- 514956
- 3A343D
- 242027
- 100E12
- 020202
Tones
- CBB9D5
- C3B3CB
- BAACC2
- B2A6B8
- A9A0AE
- A199A5
- 98939C
- 908C92
- 888689
Color harmonies
Complementary +180°
- D4C0DF
Purple Whisper
- BCD0B1
≈ Apple Ice
Analogous -30° +30°
- D4C0DF
Purple Whisper
- C4C5E7
≈ Powdered Granite
- E0BDD0
≈ Scandalous Rose
Triadic +120° +240°
- D4C0DF
Purple Whisper
- DCC5A7
≈ Sand Motif
- A5D3D1
≈ Crystal Aqua
Split-complementary +150° +210°
- D4C0DF
Purple Whisper
- CDCBA7
≈ Crisp Celery
- ADD3C0
≈ Misty Jade
Tetradic +90° +180° +270°
- D4C0DF
Purple Whisper
- E5BFB0
≈ Adorable
- BCD0B1
≈ Apple Ice
- A8D0E0
≈ Flemish Blue
Contrast & accessibility
Ag
FailOn white
WCAG 1.69:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.40:1 · APCA Lc 73
Best text color: #000000
WCAG 12.40:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--purple-whisper: #d4c0df;
--purple-whisper-rgb: 212 192 223;
--purple-whisper-oklch: oklch(0.834 0.048 313.7);
}
.element {
color: var(--purple-whisper);
background-color: hsl(279 33% 81%);
border-color: oklch(0.834 0.048 313.7);
}Tailwind CSS v4
@theme {
--color-purple-whisper: #d4c0df;
--color-purple-whisper-50: #fbf1ff;
--color-purple-whisper-100: #eee3f3;
--color-purple-whisper-200: #dccee2;
--color-purple-whisper-300: #c1b0c8;
--color-purple-whisper-400: #a997b3;
--color-purple-whisper-500: #927d9d;
--color-purple-whisper-600: #7b6a85;
--color-purple-whisper-700: #63556a;
--color-purple-whisper-800: #483e4f;
--color-purple-whisper-900: #322a37;
--color-purple-whisper-950: #1e1822;
}SCSS
$purple-whisper: #d4c0df;
$purple-whisper-rgb: 212, 192, 223;
$purple-whisper-light: mix(#fff, $purple-whisper, 20%);
$purple-whisper-dark: mix(#000, $purple-whisper, 20%);
.element {
color: $purple-whisper;
box-shadow: 0 0 0 2px rgba($purple-whisper, 0.35);
}