Named color · #E0E9D3
Mediterranean Green
Mediterranean Green is #E0E9D3: rgb(224 233 211), hsl(85 33% 87%), oklch(0.921 0.031 125.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Mediterranean Green color name →
#E0E9D3
oklch(0.921 0.031 125.2)
Color conversions
- HEX
- #e0e9d3
- RGB
- rgb(224 233 211)
- HSL
- hsl(85 33% 87%)
- HWB
- hwb(85 83% 9%)
- OKLCH
- oklch(0.921 0.031 125.2)
- OKLab
- oklab(0.921 -0.018 0.025)
- CIE Lab
- lab(91.21 -5.99 9.65)
- LCH
- lch(91.21 11.35 121.8)
- CMYK
- cmyk(4% 0% 9% 9%)
Tints · Shades · Tones
Tints
- E3EBD7
- E6EDDC
- E9F0E0
- ECF2E5
- EFF4E9
- F3F6ED
- F6F8F2
- F9FBF6
- FCFDFB
Shades
- C3CBB7
- A6AD9C
- 8A9082
- 707469
- 565A51
- 3E413A
- 272924
- 121310
- 020302
Tones
- D6DECA
- CCD3C2
- C2C8B9
- B8BEB1
- AFB3A9
- A5A9A0
- 9C9E98
- 929490
- 898A88
Color harmonies
Complementary +180°
- E0E9D3
Mediterranean Green
- EAE0F6
≈ Lingering Lilac
Analogous -30° +30°
- E0E9D3
Mediterranean Green
- EBE5CF
≈ Cauliflower
- D6EBDC
≈ Light Duck Egg Cream
Triadic +120° +240°
- E0E9D3
Mediterranean Green
- D5E8F9
≈ Cloudless
- F8DDE2
≈ Marshmallow Heart
Split-complementary +150° +210°
- E0E9D3
Mediterranean Green
- DFE4FA
≈ Lavender Mist
- F3DEED
≈ Taffeta Tint
Tetradic +90° +180° +270°
- E0E9D3
Mediterranean Green
- CFEBF2
≈ Chalky Blue White
- EAE0F6
≈ Lingering Lilac
- F9DED7
≈ Veiled Pink
Contrast & accessibility
Ag
FailOn white
WCAG 1.25:1 · APCA Lc 13
Ag
AAAOn black
WCAG 16.76:1 · APCA Lc 91
Best text color: #000000
WCAG 16.76:1 (AAA) · APCA Lc 91
Contrast pairs
Code snippets
CSS
:root {
--mediterranean-green: #e0e9d3;
--mediterranean-green-rgb: 224 233 211;
--mediterranean-green-oklch: oklch(0.921 0.031 125.2);
}
.element {
color: var(--mediterranean-green);
background-color: hsl(85 33% 87%);
border-color: oklch(0.921 0.031 125.2);
}Tailwind CSS v4
@theme {
--color-mediterranean-green: #e0e9d3;
--color-mediterranean-green-50: #f3f7ee;
--color-mediterranean-green-100: #e5eadf;
--color-mediterranean-green-200: #d0d7c9;
--color-mediterranean-green-300: #b3bbaa;
--color-mediterranean-green-400: #9aa28e;
--color-mediterranean-green-500: #818a74;
--color-mediterranean-green-600: #6d7562;
--color-mediterranean-green-700: #575d4e;
--color-mediterranean-green-800: #404439;
--color-mediterranean-green-900: #2c2f27;
--color-mediterranean-green-950: #191c15;
}SCSS
$mediterranean-green: #e0e9d3;
$mediterranean-green-rgb: 224, 233, 211;
$mediterranean-green-light: mix(#fff, $mediterranean-green, 20%);
$mediterranean-green-dark: mix(#000, $mediterranean-green, 20%);
.element {
color: $mediterranean-green;
box-shadow: 0 0 0 2px rgba($mediterranean-green, 0.35);
}