Nazwany kolor · #EDE6D9
Jelly Yoghurt
Jelly Yoghurt to #EDE6D9: rgb(237 230 217), hsl(39 36% 89%), oklch(0.927 0.019 83.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Jelly Yoghurt color name →
#EDE6D9
oklch(0.927 0.019 83.1)
Konwersje koloru
- HEX
- #ede6d9
- RGB
- rgb(237 230 217)
- HSL
- hsl(39 36% 89%)
- HWB
- hwb(39 85% 7%)
- OKLCH
- oklch(0.927 0.019 83.1)
- OKLab
- oklab(0.927 0.002 0.019)
- CIE Lab
- lab(91.58 0.82 7.24)
- LCH
- lch(91.58 7.29 83.6)
- CMYK
- cmyk(0% 3% 8% 7%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EFE8DD
- F1EBE1
- F2EDE4
- F4F0E8
- F6F2EC
- F8F5F0
- FAF7F4
- FBFAF7
- FDFCFB
Odcienie ciemniejsze
- CEC8BC
- B0ABA1
- 938E86
- 77736C
- 5C5953
- 42403B
- 2A2825
- 141311
- 030302
Tony
- E2DBD0
- D6D1C7
- CBC6BD
- C0BCB4
- B5B2AB
- AAA7A3
- 9F9D9A
- 959491
- 8A8A89
Harmonie kolorów
Komplementarna +180°
- EDE6D9
Jelly Yoghurt
- E0E7F4
≈ Crystal Falls
Analogowa -30° +30°
- EDE6D9
Jelly Yoghurt
- F2E4DB
≈ Winter Wedding
- E6E8DA
≈ Shy Green
Triada +120° +240°
- EDE6D9
Jelly Yoghurt
- D9EBEC
≈ Water Squirt
- EDE3EE
≈ Faded Fuchsia
Komplementarna rozszczepiona +150° +210°
- EDE6D9
Jelly Yoghurt
- DBE9F2
≈ Azureish White
- E7E5F3
≈ Lavender Syrup
Tetrada +90° +180° +270°
- EDE6D9
Jelly Yoghurt
- DBEBE6
≈ Reduced Turquoise
- E0E7F4
≈ Crystal Falls
- F2E2E8
≈ Pink Amour
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.24:1 · APCA Lc 12
Ag
AAANa czerni
WCAG 16.92:1 · APCA Lc 92
Najlepszy kolor tekstu: #000000
WCAG 16.92:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmenty kodu
CSS
:root {
--jelly-yoghurt: #ede6d9;
--jelly-yoghurt-rgb: 237 230 217;
--jelly-yoghurt-oklch: oklch(0.927 0.019 83.1);
}
.element {
color: var(--jelly-yoghurt);
background-color: hsl(39 36% 89%);
border-color: oklch(0.927 0.019 83.1);
}Tailwind CSS v4
@theme {
--color-jelly-yoghurt: #ede6d9;
--color-jelly-yoghurt-50: #f8f5ef;
--color-jelly-yoghurt-100: #ebe7e1;
--color-jelly-yoghurt-200: #d8d4cb;
--color-jelly-yoghurt-300: #bcb7ad;
--color-jelly-yoghurt-400: #a49e92;
--color-jelly-yoghurt-500: #8c8578;
--color-jelly-yoghurt-600: #777166;
--color-jelly-yoghurt-700: #5f5a51;
--color-jelly-yoghurt-800: #46423b;
--color-jelly-yoghurt-900: #302d29;
--color-jelly-yoghurt-950: #1c1a16;
}SCSS
$jelly-yoghurt: #ede6d9;
$jelly-yoghurt-rgb: 237, 230, 217;
$jelly-yoghurt-light: mix(#fff, $jelly-yoghurt, 20%);
$jelly-yoghurt-dark: mix(#000, $jelly-yoghurt, 20%);
.element {
color: $jelly-yoghurt;
box-shadow: 0 0 0 2px rgba($jelly-yoghurt, 0.35);
}