Nazwany kolor · #E3D7E5
Lavender Vista
Lavender Vista to #E3D7E5: rgb(227 215 229), hsl(291 21% 87%), oklch(0.893 0.023 321.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Lavender Vista color name →
#E3D7E5
oklch(0.893 0.023 321.4)
Konwersje koloru
- HEX
- #e3d7e5
- RGB
- rgb(227 215 229)
- HSL
- hsl(291 21% 87%)
- HWB
- hwb(291 84% 10%)
- OKLCH
- oklch(0.893 0.023 321.4)
- OKLab
- oklab(0.893 0.018 -0.014)
- CIE Lab
- lab(87.27 6.12 -5.35)
- LCH
- lch(87.27 8.12 318.8)
- CMYK
- cmyk(1% 6% 0% 10%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E6DBE8
- E9DFEA
- EBE3ED
- EEE7EF
- F1EBF2
- F4EFF5
- F7F3F7
- F9F7FA
- FCFBFC
Odcienie ciemniejsze
- C5BBC7
- A89FAA
- 8C858E
- 716B72
- 575258
- 3F3B3F
- 272528
- 121112
- 030203
Tony
- D9CEDA
- CEC5D0
- C4BCC6
- BAB3BB
- B0AAB1
- A6A2A7
- 9D999D
- 939193
- 89888A
Harmonie kolorów
Komplementarna +180°
- E3D7E5
Lavender Vista
- D4E0D2
≈ Misty Marsh
Analogowa -30° +30°
- E3D7E5
Lavender Vista
- DBD9EA
≈ Eyeshadow
- E9D6DD
≈ Swiss Rose
Triada +120° +240°
- E3D7E5
Lavender Vista
- E3DBCB
≈ Frankly Earnest
- CBE1E2
≈ Melting Point
Komplementarna rozszczepiona +150° +210°
- E3D7E5
Lavender Vista
- DCDDCC
≈ Light Soft Kind
- CEE1DA
≈ Light Meadow Lane
Tetrada +90° +180° +270°
- E3D7E5
Lavender Vista
- E9D8CE
≈ Malted Milk
- D4E0D2
≈ Misty Marsh
- CDDFE8
≈ Duck’s Egg Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.38:1 · APCA Lc 19
Ag
AAANa czerni
WCAG 15.11:1 · APCA Lc 85
Najlepszy kolor tekstu: #000000
WCAG 15.11:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmenty kodu
CSS
:root {
--lavender-vista: #e3d7e5;
--lavender-vista-rgb: 227 215 229;
--lavender-vista-oklch: oklch(0.893 0.023 321.4);
}
.element {
color: var(--lavender-vista);
background-color: hsl(291 21% 87%);
border-color: oklch(0.893 0.023 321.4);
}Tailwind CSS v4
@theme {
--color-lavender-vista: #e3d7e5;
--color-lavender-vista-50: #f8f3f9;
--color-lavender-vista-100: #ece5ec;
--color-lavender-vista-200: #d9d1da;
--color-lavender-vista-300: #bdb4be;
--color-lavender-vista-400: #a59aa7;
--color-lavender-vista-500: #8d818f;
--color-lavender-vista-600: #786e79;
--color-lavender-vista-700: #605861;
--color-lavender-vista-800: #464047;
--color-lavender-vista-900: #302c31;
--color-lavender-vista-950: #1d191d;
}SCSS
$lavender-vista: #e3d7e5;
$lavender-vista-rgb: 227, 215, 229;
$lavender-vista-light: mix(#fff, $lavender-vista, 20%);
$lavender-vista-dark: mix(#000, $lavender-vista, 20%);
.element {
color: $lavender-vista;
box-shadow: 0 0 0 2px rgba($lavender-vista, 0.35);
}