Nazwany kolor · #E9D2EF
Lavender Princess
Lavender Princess to #E9D2EF: rgb(233 210 239), hsl(288 48% 88%), oklch(0.891 0.046 319.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Lavender Princess color name →
#E9D2EF
oklch(0.891 0.046 319.2)
Konwersje koloru
- HEX
- #e9d2ef
- RGB
- rgb(233 210 239)
- HSL
- hsl(288 48% 88%)
- HWB
- hwb(288 82% 6%)
- OKLCH
- oklch(0.891 0.046 319.2)
- OKLab
- oklab(0.891 0.035 -0.03)
- CIE Lab
- lab(86.78 12.05 -11.24)
- LCH
- lch(86.78 16.48 317)
- CMYK
- cmyk(3% 12% 0% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EBD6F1
- EDDBF2
- F0DFF4
- F2E4F6
- F4E8F7
- F6EDF9
- F8F1FA
- FBF6FC
- FDFAFD
Odcienie ciemniejsze
- CBB6D0
- AD9BB1
- 908194
- 746878
- 5A505C
- 413942
- 29242A
- 131014
- 030203
Tony
- DECAE3
- D3C1D8
- C8B9CC
- BEB0C1
- B3A8B6
- A9A0AB
- 9E98A0
- 949095
- 8A888B
Harmonie kolorów
Komplementarna +180°
- E9D2EF
Lavender Princess
- CCE3C6
≈ Soft Moss
Analogowa -30° +30°
- E9D2EF
Lavender Princess
- DAD7F9
≈ Japan Blush
- F4CFE0
≈ Minimal Rose
Triada +120° +240°
- E9D2EF
Lavender Princess
- ECD8BA
≈ Cameo White
- B8E5E7
≈ Soaring Sky
Komplementarna rozszczepiona +150° +210°
- E9D2EF
Lavender Princess
- DDDEBB
≈ Endless Silk
- BEE6D6
≈ Jade Spell
Tetrada +90° +180° +270°
- E9D2EF
Lavender Princess
- F6D3C1
≈ Dreamsicle
- CCE3C6
≈ Soft Moss
- BDE2F4
≈ Breaking the Ice
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.40:1 · APCA Lc 20
Ag
AAANa czerni
WCAG 14.92:1 · APCA Lc 84
Najlepszy kolor tekstu: #000000
WCAG 14.92:1 (AAA) · APCA Lc 84
Contrast pairs
Fragmenty kodu
CSS
:root {
--lavender-princess: #e9d2ef;
--lavender-princess-rgb: 233 210 239;
--lavender-princess-oklch: oklch(0.891 0.046 319.2);
}
.element {
color: var(--lavender-princess);
background-color: hsl(288 48% 88%);
border-color: oklch(0.891 0.046 319.2);
}Tailwind CSS v4
@theme {
--color-lavender-princess: #e9d2ef;
--color-lavender-princess-50: #fcf1fd;
--color-lavender-princess-100: #efe3f1;
--color-lavender-princess-200: #decee0;
--color-lavender-princess-300: #c3b0c6;
--color-lavender-princess-400: #ab96b0;
--color-lavender-princess-500: #947d9a;
--color-lavender-princess-600: #7d6a82;
--color-lavender-princess-700: #645468;
--color-lavender-princess-800: #493e4d;
--color-lavender-princess-900: #332a36;
--color-lavender-princess-950: #1e1821;
}SCSS
$lavender-princess: #e9d2ef;
$lavender-princess-rgb: 233, 210, 239;
$lavender-princess-light: mix(#fff, $lavender-princess, 20%);
$lavender-princess-dark: mix(#000, $lavender-princess, 20%);
.element {
color: $lavender-princess;
box-shadow: 0 0 0 2px rgba($lavender-princess, 0.35);
}