Named color · #E0B7C2
Melanie
Melanie is #E0B7C2: rgb(224 183 194), hsl(344 40% 80%), oklch(0.819 0.049 0.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Melanie color name →
#E0B7C2
oklch(0.819 0.049 0.3)
Color conversions
- HEX
- #e0b7c2
- RGB
- rgb(224 183 194)
- HSL
- hsl(344 40% 80%)
- HWB
- hwb(344 72% 12%)
- OKLCH
- oklch(0.819 0.049 0.3)
- OKLab
- oklab(0.819 0.049 0)
- CIE Lab
- lab(78.35 16.51 0.29)
- LCH
- lch(78.35 16.52 1)
- CMYK
- cmyk(0% 18% 13% 12%)
Tints · Shades · Tones
Tints
- E3BEC8
- E7C5CE
- EACCD4
- EDD3DA
- F0DBE0
- F3E2E6
- F6E9EC
- F9F0F3
- FCF8F9
Shades
- C39FA8
- A6878F
- 8A7077
- 705A60
- 564549
- 3E3134
- 271E20
- 120C0E
- 020202
Tones
- D6B1BB
- CCACB4
- C3A6AE
- B9A1A7
- AF9BA0
- A6969A
- 9C9093
- 938B8D
- 898586
Color harmonies
Complementary +180°
- E0B7C2
Melanie
- A2CFC5
≈ Phosphorus
Analogous -30° +30°
- E0B7C2
Melanie
- D7B9D3
≈ Sunday Gloves
- E2B9B1
≈ Cavern Pink
Triadic +120° +240°
- E0B7C2
Melanie
- BFC9A6
≈ Pale Leaf
- A8C9E1
≈ Template
Split-complementary +150° +210°
- E0B7C2
Melanie
- AECDB3
≈ Pastel Mint Green
- 9FCDD6
≈ Sea Dew
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.79:1 · APCA Lc 33
Ag
AAAOn black
WCAG 11.72:1 · APCA Lc 70
Best text color: #000000
WCAG 11.72:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
CSS
:root {
--melanie: #e0b7c2;
--melanie-rgb: 224 183 194;
--melanie-oklch: oklch(0.819 0.049 0.3);
}
.element {
color: var(--melanie);
background-color: hsl(344 40% 80%);
border-color: oklch(0.819 0.049 0.3);
}Tailwind CSS v4
@theme {
--color-melanie: #e0b7c2;
--color-melanie-50: #fff0f4;
--color-melanie-100: #f7e1e6;
--color-melanie-200: #e8ccd2;
--color-melanie-300: #ceadb5;
--color-melanie-400: #b8939d;
--color-melanie-500: #a27984;
--color-melanie-600: #896670;
--color-melanie-700: #6e525a;
--color-melanie-800: #513b42;
--color-melanie-900: #38292e;
--color-melanie-950: #23171a;
}SCSS
$melanie: #e0b7c2;
$melanie-rgb: 224, 183, 194;
$melanie-light: mix(#fff, $melanie, 20%);
$melanie-dark: mix(#000, $melanie, 20%);
.element {
color: $melanie;
box-shadow: 0 0 0 2px rgba($melanie, 0.35);
}