Named color · #DFEAE1
Wishy-Washy Green
Wishy-Washy Green is #DFEAE1: rgb(223 234 225), hsl(131 21% 90%), oklch(0.926 0.017 151.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Wishy-Washy Green color name →
#DFEAE1
oklch(0.926 0.017 151.1)
Color conversions
- HEX
- #dfeae1
- RGB
- rgb(223 234 225)
- HSL
- hsl(131 21% 90%)
- HWB
- hwb(131 87% 8%)
- OKLCH
- oklch(0.926 0.017 151.1)
- OKLab
- oklab(0.926 -0.015 0.008)
- CIE Lab
- lab(91.67 -5.01 3.05)
- LCH
- lch(91.67 5.87 148.7)
- CMYK
- cmyk(5% 0% 4% 8%)
Tints · Shades · Tones
Tints
- E2ECE4
- E5EEE7
- E9F0EA
- ECF2ED
- EFF4F0
- F2F7F3
- F5F9F6
- F9FBF9
- FCFDFC
Shades
- C2CBC4
- A5AEA7
- 8A918B
- 6F7570
- 565A56
- 3D413E
- 272927
- 121312
- 020302
Tones
- D5DFD7
- CBD4CD
- C2C9C3
- B8BEB9
- AEB4AF
- A5A9A6
- 9B9F9C
- 929493
- 898A89
Color harmonies
Complementary +180°
- DFEAE1
Wishy-Washy Green
- EEE3EC
≈ Faded Fuchsia
Analogous -30° +30°
- DFEAE1
Wishy-Washy Green
- E5E9DC
≈ Spinach White
- DBEBE7
≈ Reduced Turquoise
Triadic +120° +240°
- DFEAE1
Wishy-Washy Green
- E2E6F2
≈ Crystal Falls
- F2E3E0
≈ Hint of Pink
Split-complementary +150° +210°
- DFEAE1
Wishy-Washy Green
- E8E4F0
≈ Modest Violet
- F1E2E6
≈ Dulcet Pink
Tetradic +90° +180° +270°
- DFEAE1
Wishy-Washy Green
- DDE8F1
≈ St. Petersburg
- EEE3EC
≈ Faded Fuchsia
- EFE4DC
≈ Soft Feather
Contrast & accessibility
Ag
FailOn white
WCAG 1.23:1 · APCA Lc 12
Ag
AAAOn black
WCAG 16.99:1 · APCA Lc 92
Best text color: #000000
WCAG 16.99:1 (AAA) · APCA Lc 92
Contrast pairs
Code snippets
CSS
:root {
--wishy-washy-green: #dfeae1;
--wishy-washy-green-rgb: 223 234 225;
--wishy-washy-green-oklch: oklch(0.926 0.017 151.1);
}
.element {
color: var(--wishy-washy-green);
background-color: hsl(131 21% 90%);
border-color: oklch(0.926 0.017 151.1);
}Tailwind CSS v4
@theme {
--color-wishy-washy-green: #dfeae1;
--color-wishy-washy-green-50: #f2f7f3;
--color-wishy-washy-green-100: #e4eae5;
--color-wishy-washy-green-200: #cfd6d1;
--color-wishy-washy-green-300: #b1bab3;
--color-wishy-washy-green-400: #98a199;
--color-wishy-washy-green-500: #7f8a81;
--color-wishy-washy-green-600: #6b746d;
--color-wishy-washy-green-700: #565d57;
--color-wishy-washy-green-800: #3f443f;
--color-wishy-washy-green-900: #2b2f2c;
--color-wishy-washy-green-950: #181c19;
}SCSS
$wishy-washy-green: #dfeae1;
$wishy-washy-green-rgb: 223, 234, 225;
$wishy-washy-green-light: mix(#fff, $wishy-washy-green, 20%);
$wishy-washy-green-dark: mix(#000, $wishy-washy-green, 20%);
.element {
color: $wishy-washy-green;
box-shadow: 0 0 0 2px rgba($wishy-washy-green, 0.35);
}