Nazwany kolor · #EBE8E7
Coconut Agony
Coconut Agony to #EBE8E7: rgb(235 232 231), hsl(15 9% 91%), oklch(0.933 0.004 39.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Coconut Agony color name →
#EBE8E7
oklch(0.933 0.004 39.5)
Konwersje koloru
- HEX
- #ebe8e7
- RGB
- rgb(235 232 231)
- HSL
- hsl(15 9% 91%)
- HWB
- hwb(15 91% 8%)
- OKLCH
- oklch(0.933 0.004 39.5)
- OKLab
- oklab(0.933 0.003 0.002)
- CIE Lab
- lab(92.21 0.91 0.86)
- LCH
- lch(92.21 1.26 43.4)
- CMYK
- cmyk(0% 1% 2% 8%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- EDEAE9
- EFEDEC
- F1EFEE
- F3F1F1
- F5F3F3
- F7F6F5
- F9F8F8
- FBFAFA
- FDFDFD
Odcienie ciemniejsze
- CCCAC9
- AEACAB
- 91908F
- 757473
- 5B5959
- 414040
- 292928
- 131313
- 030303
Tony
- E0DDDC
- D5D2D2
- CAC8C7
- BFBDBC
- B4B3B2
- A9A8A8
- 9F9E9E
- 949494
- 8A8A8A
Harmonie kolorów
Komplementarna +180°
- EBE8E7
Coconut Agony
- E6E9EA
≈ Swirling Water
Analogowa -30° +30°
- EBE8E7
Coconut Agony
- EBE8E8
≈ Coconut Agony
- EAE8E6
≈ Heavenly White
Triada +120° +240°
- EBE8E7
Coconut Agony
- E7E9E8
≈ Swirling Water
- E8E9EB
≈ Snowbank
Komplementarna rozszczepiona +150° +210°
- EBE8E7
Coconut Agony
- E6EAE9
≈ Swirling Water
- E7E9EB
≈ Snow Cloud
Tetrada +90° +180° +270°
- EBE8E7
Coconut Agony
- E8E9E7
≈ Mt. Hood White
- E6E9EA
≈ Swirling Water
- E9E8EB
≈ Dandelion Floatie
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.21:1 · APCA Lc 11
Ag
AAANa czerni
WCAG 17.22:1 · APCA Lc 93
Najlepszy kolor tekstu: #000000
WCAG 17.22:1 (AAA) · APCA Lc 93
Contrast pairs
Fragmenty kodu
CSS
:root {
--coconut-agony: #ebe8e7;
--coconut-agony-rgb: 235 232 231;
--coconut-agony-oklch: oklch(0.933 0.004 39.5);
}
.element {
color: var(--coconut-agony);
background-color: hsl(15 9% 91%);
border-color: oklch(0.933 0.004 39.5);
}Tailwind CSS v4
@theme {
--color-coconut-agony: #ebe8e7;
--color-coconut-agony-50: #f6f5f4;
--color-coconut-agony-100: #e9e7e7;
--color-coconut-agony-200: #d5d4d3;
--color-coconut-agony-300: #b9b7b6;
--color-coconut-agony-400: #a09e9d;
--color-coconut-agony-500: #888584;
--color-coconut-agony-600: #737170;
--color-coconut-agony-700: #5c5a5a;
--color-coconut-agony-800: #434241;
--color-coconut-agony-900: #2f2d2d;
--color-coconut-agony-950: #1b1a1a;
}SCSS
$coconut-agony: #ebe8e7;
$coconut-agony-rgb: 235, 232, 231;
$coconut-agony-light: mix(#fff, $coconut-agony, 20%);
$coconut-agony-dark: mix(#000, $coconut-agony, 20%);
.element {
color: $coconut-agony;
box-shadow: 0 0 0 2px rgba($coconut-agony, 0.35);
}