Nazwany kolor · #E4DCC6
Chartreuse Frost
Chartreuse Frost to #E4DCC6: rgb(228 220 198), hsl(44 36% 84%), oklch(0.895 0.031 90.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Chartreuse Frost color name →
#E4DCC6
oklch(0.895 0.031 90.3)
Konwersje koloru
- HEX
- #e4dcc6
- RGB
- rgb(228 220 198)
- HSL
- hsl(44 36% 84%)
- HWB
- hwb(44 78% 11%)
- OKLCH
- oklch(0.895 0.031 90.3)
- OKLab
- oklab(0.895 0 0.031)
- CIE Lab
- lab(87.96 0.12 11.88)
- LCH
- lch(87.96 11.88 89.4)
- CMYK
- cmyk(0% 4% 13% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E7DFCC
- E9E3D1
- ECE6D7
- EFEADD
- F1EDE2
- F4F1E8
- F7F4EE
- FAF8F4
- FCFBF9
Odcienie ciemniejsze
- C6BFAC
- A9A392
- 8D887A
- 726E62
- 58544B
- 3F3C35
- 282621
- 12110E
- 030202
Tony
- DAD2BF
- CFC9B8
- C5BFB1
- BBB6A9
- B1ADA2
- A7A49B
- 9D9B95
- 93928E
- 8A8987
Harmonie kolorów
Komplementarna +180°
- E4DCC6
Chartreuse Frost
- D4DCF1
≈ Puffy Cloud
Analogowa -30° +30°
- E4DCC6
Chartreuse Frost
- ECD8C9
≈ Nutmeg Frost
- D9E0C9
≈ Palm Breeze
Triada +120° +240°
- E4DCC6
Chartreuse Frost
- C6E2E8
≈ Aviary Blue
- E9D5E6
≈ Champagne Elegance
Komplementarna rozszczepiona +150° +210°
- E4DCC6
Chartreuse Frost
- CBE0EF
≈ Atlantic Breeze
- DFD8EE
≈ Old Chalk
Tetrada +90° +180° +270°
- E4DCC6
Chartreuse Frost
- C8E3DD
≈ Misty Isle
- D4DCF1
≈ Puffy Cloud
- EFD4DB
≈ Priscilla
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.36:1 · APCA Lc 18
Ag
AAANa czerni
WCAG 15.35:1 · APCA Lc 86
Najlepszy kolor tekstu: #000000
WCAG 15.35:1 (AAA) · APCA Lc 86
Contrast pairs
Fragmenty kodu
CSS
:root {
--chartreuse-frost: #e4dcc6;
--chartreuse-frost-rgb: 228 220 198;
--chartreuse-frost-oklch: oklch(0.895 0.031 90.3);
}
.element {
color: var(--chartreuse-frost);
background-color: hsl(44 36% 84%);
border-color: oklch(0.895 0.031 90.3);
}Tailwind CSS v4
@theme {
--color-chartreuse-frost: #e4dcc6;
--color-chartreuse-frost-50: #f8f5eb;
--color-chartreuse-frost-100: #ebe8dd;
--color-chartreuse-frost-200: #d9d4c6;
--color-chartreuse-frost-300: #bdb7a6;
--color-chartreuse-frost-400: #a59e8a;
--color-chartreuse-frost-500: #8e866f;
--color-chartreuse-frost-600: #78715e;
--color-chartreuse-frost-700: #605a4b;
--color-chartreuse-frost-800: #474236;
--color-chartreuse-frost-900: #312e25;
--color-chartreuse-frost-950: #1d1a14;
}SCSS
$chartreuse-frost: #e4dcc6;
$chartreuse-frost-rgb: 228, 220, 198;
$chartreuse-frost-light: mix(#fff, $chartreuse-frost, 20%);
$chartreuse-frost-dark: mix(#000, $chartreuse-frost, 20%);
.element {
color: $chartreuse-frost;
box-shadow: 0 0 0 2px rgba($chartreuse-frost, 0.35);
}