Nazwany kolor · #D4C0DF
Purple Whisper
Purple Whisper to #D4C0DF: rgb(212 192 223), hsl(279 33% 81%), oklch(0.834 0.048 313.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Purple Whisper color name →
#D4C0DF
oklch(0.834 0.048 313.7)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D8C6E2
- DDCCE5
- E1D3E9
- E5D9EC
- E9DFEF
- EEE6F2
- F2ECF5
- F6F2F9
- FBF9FC
Odcienie ciemniejsze
- B8A7C2
- 9D8EA5
- 83768A
- 695F6F
- 514956
- 3A343D
- 242027
- 100E12
- 020202
Tony
- CBB9D5
- C3B3CB
- BAACC2
- B2A6B8
- A9A0AE
- A199A5
- 98939C
- 908C92
- 888689
Harmonie kolorów
Komplementarna +180°
- D4C0DF
Purple Whisper
- BCD0B1
≈ Apple Ice
Analogowa -30° +30°
- D4C0DF
Purple Whisper
- C4C5E7
≈ Powdered Granite
- E0BDD0
≈ Scandalous Rose
Triada +120° +240°
- D4C0DF
Purple Whisper
- DCC5A7
≈ Sand Motif
- A5D3D1
≈ Crystal Aqua
Komplementarna rozszczepiona +150° +210°
- D4C0DF
Purple Whisper
- CDCBA7
≈ Crisp Celery
- ADD3C0
≈ Misty Jade
Tetrada +90° +180° +270°
- D4C0DF
Purple Whisper
- E5BFB0
≈ Adorable
- BCD0B1
≈ Apple Ice
- A8D0E0
≈ Flemish Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.69:1 · APCA Lc 30
Ag
AAANa czerni
WCAG 12.40:1 · APCA Lc 73
Najlepszy kolor tekstu: #000000
WCAG 12.40:1 (AAA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
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);
}