Benoemde kleur · #EFE8DC
Sugar Soap
Sugar Soap is #EFE8DC: rgb(239 232 220), hsl(38 37% 90%), oklch(0.933 0.018 81.3). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · Sugar Soap color name →
#EFE8DC
oklch(0.933 0.018 81.3)
Kleurconversies
- HEX
- #efe8dc
- RGB
- rgb(239 232 220)
- HSL
- hsl(38 37% 90%)
- HWB
- hwb(38 86% 6%)
- OKLCH
- oklch(0.933 0.018 81.3)
- OKLab
- oklab(0.933 0.003 0.018)
- CIE Lab
- lab(92.31 0.94 6.74)
- LCH
- lch(92.31 6.81 82.1)
- CMYK
- cmyk(0% 3% 8% 6%)
Tinten · Schaduwen · Tonen
Tinten
- F1EADF
- F2EDE3
- F4EFE6
- F5F1EA
- F7F3ED
- F9F6F1
- FAF8F4
- FCFAF8
- FDFDFB
Schaduwen
- D0CABF
- B1ACA3
- 949088
- 78746E
- 5C5954
- 42403C
- 2A2926
- 141311
- 030302
Tonen
- E3DDD2
- D8D2C9
- CCC8BF
- C1BDB6
- B6B3AD
- ABA8A4
- A09E9B
- 959492
- 8B8A89
Kleurharmonieën
Complementair +180°
- EFE8DC
Sugar Soap
- E2E9F5
≈ Harbour Afternoon
Analoog -30° +30°
- EFE8DC
Sugar Soap
- F3E6DE
≈ White Meadow
- E9EADD
≈ Sterling Shadow
Triadisch +120° +240°
- EFE8DC
Sugar Soap
- DCEDEE
≈ White Glaze
- EFE5F0
≈ Tranquil Eve
Gesplitst complementair +150° +210°
- EFE8DC
Sugar Soap
- DEEBF3
≈ Ice Fishing
- E9E7F4
≈ Tranquil Eve
Tetradisch +90° +180° +270°
- EFE8DC
Sugar Soap
- DEEDE7
≈ Tranquil
- E2E9F5
≈ Harbour Afternoon
- F3E4EA
≈ Nina
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.21:1 · APCA Lc 11
Ag
AAAOp zwart
WCAG 17.24:1 · APCA Lc 93
Beste tekstkleur: #000000
WCAG 17.24:1 (AAA) · APCA Lc 93
Contrast pairs
Codefragmenten
CSS
:root {
--sugar-soap: #efe8dc;
--sugar-soap-rgb: 239 232 220;
--sugar-soap-oklch: oklch(0.933 0.018 81.3);
}
.element {
color: var(--sugar-soap);
background-color: hsl(38 37% 90%);
border-color: oklch(0.933 0.018 81.3);
}Tailwind CSS v4
@theme {
--color-sugar-soap: #efe8dc;
--color-sugar-soap-50: #f7f5f0;
--color-sugar-soap-100: #ebe7e1;
--color-sugar-soap-200: #d8d4cc;
--color-sugar-soap-300: #bcb7ad;
--color-sugar-soap-400: #a49e93;
--color-sugar-soap-500: #8c8579;
--color-sugar-soap-600: #777167;
--color-sugar-soap-700: #5f5a52;
--color-sugar-soap-800: #46423c;
--color-sugar-soap-900: #302d29;
--color-sugar-soap-950: #1c1a17;
}SCSS
$sugar-soap: #efe8dc;
$sugar-soap-rgb: 239, 232, 220;
$sugar-soap-light: mix(#fff, $sugar-soap, 20%);
$sugar-soap-dark: mix(#000, $sugar-soap, 20%);
.element {
color: $sugar-soap;
box-shadow: 0 0 0 2px rgba($sugar-soap, 0.35);
}