Named color · #EDE3E0
Distilled Watermelon
Distilled Watermelon is #EDE3E0: rgb(237 227 224), hsl(14 27% 90%), oklch(0.923 0.012 37.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Distilled Watermelon color name →
#EDE3E0
oklch(0.923 0.012 37.4)
Color conversions
- HEX
- #ede3e0
- RGB
- rgb(237 227 224)
- HSL
- hsl(14 27% 90%)
- HWB
- hwb(14 88% 7%)
- OKLCH
- oklch(0.923 0.012 37.4)
- OKLab
- oklab(0.923 0.009 0.007)
- CIE Lab
- lab(90.98 3.13 2.74)
- LCH
- lch(90.98 4.16 41.2)
- CMYK
- cmyk(0% 4% 5% 7%)
Tints · Shades · Tones
Tints
- EFE6E3
- F1E9E6
- F2EBE9
- F4EEEC
- F6F1EF
- F8F4F3
- FAF7F6
- FBF9F9
- FDFCFC
Shades
- CEC5C3
- B0A8A6
- 938C8A
- 777170
- 5C5756
- 423F3E
- 2A2727
- 141212
- 030302
Tones
- E2D9D6
- D6CECC
- CBC4C2
- C0BAB8
- B5B0AF
- AAA6A5
- 9F9D9C
- 959392
- 8A8989
Color harmonies
Complementary +180°
- EDE3E0
Distilled Watermelon
- DDE8EB
≈ Moby Dick
Analogous -30° +30°
- EDE3E0
Distilled Watermelon
- EDE2E4
≈ Delicacy White
- EBE4DD
≈ Stone Quarry
Triadic +120° +240°
- EDE3E0
Distilled Watermelon
- E0E8E2
≈ Glimmer
- E3E5ED
≈ Ghostly Tuna
Split-complementary +150° +210°
- EDE3E0
Distilled Watermelon
- DDE8E7
≈ Carefree
- E0E6ED
≈ Genteel Lavender
Tetradic +90° +180° +270°
- EDE3E0
Distilled Watermelon
- E3E7DF
≈ White Blaze
- DDE8EB
≈ Moby Dick
- E7E4EC
≈ Soft Iris
Contrast & accessibility
Ag
FailOn white
WCAG 1.26:1 · APCA Lc 13
Ag
AAAOn black
WCAG 16.66:1 · APCA Lc 91
Best text color: #000000
WCAG 16.66:1 (AAA) · APCA Lc 91
Contrast pairs
Code snippets
CSS
:root {
--distilled-watermelon: #ede3e0;
--distilled-watermelon-rgb: 237 227 224;
--distilled-watermelon-oklch: oklch(0.923 0.012 37.4);
}
.element {
color: var(--distilled-watermelon);
background-color: hsl(14 27% 90%);
border-color: oklch(0.923 0.012 37.4);
}Tailwind CSS v4
@theme {
--color-distilled-watermelon: #ede3e0;
--color-distilled-watermelon-50: #f8f4f3;
--color-distilled-watermelon-100: #ece7e5;
--color-distilled-watermelon-200: #d9d3d0;
--color-distilled-watermelon-300: #bdb5b3;
--color-distilled-watermelon-400: #a59c9a;
--color-distilled-watermelon-500: #8e8481;
--color-distilled-watermelon-600: #786f6d;
--color-distilled-watermelon-700: #605957;
--color-distilled-watermelon-800: #464140;
--color-distilled-watermelon-900: #312d2c;
--color-distilled-watermelon-950: #1d1a19;
}SCSS
$distilled-watermelon: #ede3e0;
$distilled-watermelon-rgb: 237, 227, 224;
$distilled-watermelon-light: mix(#fff, $distilled-watermelon, 20%);
$distilled-watermelon-dark: mix(#000, $distilled-watermelon, 20%);
.element {
color: $distilled-watermelon;
box-shadow: 0 0 0 2px rgba($distilled-watermelon, 0.35);
}